【问题标题】:Why my if statements don't work properly?为什么我的 if 语句不能正常工作?
【发布时间】:2022-01-05 11:03:28
【问题描述】:

我正在创建一个程序,如果不显示错误,则必须检查输入中的值是否满足所有条件。

for(let i = 0; i < bannedNumbers.length; i++){
    signIn.addEventListener('click', ()=>{

        if(signInFirstName.value == ""){
            signInFirstName.nextSibling.textContent = "Fill in the field!"
        } else{
            if(signInFirstName.value.includes(bannedNumbers[i])){
                signInFirstName.nextSibling.textContent = "You can't use symbols or/and numbers in your first name"
            } else{
                signInFirstName.nextSibling.textContent = "vbvnv"
            }
        }
    })
        
}

【问题讨论】:

  • 欢迎来到 Stack Overflow!访问help center,使用tour 了解内容和How to Ask。如果您遇到困难,请发布您的尝试minimal reproducible example,并使用[&lt;&gt;] sn-p 编辑器记录输入和预期输出。
  • 尝试使用===
  • 还是不行
  • 为什么要在一个元素中添加bannedNumbers.length 事件监听器?
  • for(let i = 0; i &lt; bannedNumbers.length; i++){ 可能属于if(signInFirstName.value.includes(bannedNumbers[i])){ 行之前

标签: javascript if-statement nextsibling


【解决方案1】:

你可能有意这样做

但我不建议阻止人们输入特殊字符。

Marie-Louise 和 Jean-Jacques 呢?

const re = /[^a-zA-Z]/g
const validName = (fld, name) =>   {
  const val = fld.value.trim();
  let error = "";
  if (val === "") {
    error = `Please enter ${name}`; 
  } else if (re.test(val)) {
    error = `You can't use symbols and/or numbers in ${name}`
  }
  fld.nextSibling.textContent = error ? error : "OK";
  return error === "";
};
document.getElementById("signInForm").addEventListener('submit', (e) => {
  const signInFirstName = this.firstName;
  if (!validName(signInFirstName,"your first name")) e.preventDefault(); // cancel submit
  const signInLastName = this.lastName;
  if (!validName(signInLastName,"your last name")) e.preventDefault(); // cancel submit
})
<form id="signInForm">
  <label>First name: <input id="firstName" name="firstName" type="text"><span class="error"></span></label><br/>
  <label>Last name: <input id="lastName" name="lastName" type="text"><span class="error"></span></label><br/>
  <input type="submit" />
</form>

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2021-01-14
    • 1970-01-01
    • 1970-01-01
    • 2023-02-03
    • 1970-01-01
    • 2011-03-14
    • 1970-01-01
    • 2022-12-03
    相关资源
    最近更新 更多