如果数据属性 === 输入文本 in Javascript?
我是说如果 数据=“字” 输入值="单词"
当我写 w - letter color is green else letter color red.
wo -stay green else red;
wor - green else red;
word -green else red;
我的代码在这里:
let all = document.querySelectorAll('#input_Text')
all.forEach(element => element.addEventListener('input',(e)=>{
if(e.target.value === element.getAttribute('data-verb')){
element.style.border = "5px solid green"
}else{element.style.border = "5px solid red"};
}));
非常感谢
最佳答案
您可以使用 Document.querySelectorAll()获取所有输入元素 'input[data-verb]'
并附加一个 input
事件以在元素的值为 String.prototype.startsWith() 时设置样式边框输入的文字:
document
.querySelectorAll('input[data-verb]')
.forEach(el => el.addEventListener('input', ({ target: { value }}) => {
const color = el.getAttribute('data-verb').startsWith(value) ? 'green' : 'red'
el.style.border = `5px solid ${color}`
}))
<input type="text" data-verb="word">
关于javascript - 如果 javascript 中的数据属性(HTML)=== 输入文本,如何更改已写入输入的每个字母的 javascript 颜色?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/69233493/
相关文章:
c# - 如何将 ViewData 传递给类中的 Action 方法?
java - 如何检查至少一个 boolean 值是否为真?
javascript - leetcode 如何做到这一点 : Read user's input
apache-kafka - 如何为 Kafka 主题实现生存时间 (TTL)
swift - 是否有可能在 Swift 的枚举中将多个案例分组并表示为另一个案例?
c++ - 为什么 C++ 数组的括号在变量上而不是在数据类型上?
python - 将函数重新定义为自身的一部分——为什么非法?