Javascript输入样式-函数在第一个IF处停止

vngu2lb8 于 2023-02-21 发布在 Java

关注(0)|答案(1)|浏览(113)

我想在Javascript中实现实时输入数据验证，不幸的是它总是停在第一个IF（红色字段边框-太短的长度）。你知道什么可能导致这一点吗？
超文本：

<input type="text" id="fullname" name="fullname" minlength="3" maxlength=12 pattern="[a-zA-z]" onkeydown="validateName()" required>

JS系统

let nameValue = document.getElementById("fullname")

function validateName(){
  if(nameValue.innerText.length<3){
  nameValue.setAttribute("style","border-color:red")
}
  else if(nameValue.innerText.length>=3 && nameValue.innerText.length<=12){
    nameValue.setAttribute("style", "border-color:green")
  }
  else{
    nameValue.setAttribute("style", "border-color:red")
  }
}

JavaScript

来源：https://stackoverflow.com/questions/75510512/javascript-input-styling-function-stops-at-first-if

1条答案

按热度按时间

wlp8pajw1#

使用从事件返回的目标变量更容易跟踪事件。

function validateName(e) {
  if (e.target.value.length < 3) {
    e.target.style.borderColor = "red"
  } else if (e.target.value.length >= 3 && e.target.value.length <= 12) {
    e.target.style.borderColor = "green"
  } else {
    e.target.style.borderColor = "red"
  }
}

<input type="text" id="fullname" name="fullname" minlength="3" maxlength=12 pattern="[a-zA-z]" oninput="validateName(event)" required />

赞(0）回复(0）举报 2023-02-21

我来回答

Javascript输入样式-函数在第一个IF处停止

1条答案

相关问题

热门标签

最新问答