Question

关于使用JS进行数据验证的大学作业，我遇到了问题。我已将字段设置为触发onblur验证，并且除确保密码和密码验证有效的代码外，其他所有功能均正常。验证功能转到！=后，当退出该字段时，似乎onblur不再运行。

我在这里提取了代码。谁能告诉我我做错了什么？

function PVVal() {
  var pwTest = document.getElementsByName("password")[0].value;
  var pwVerify = document.getElementsByName("passwordVerify")[0].value;
  //trim whitespace
  pwTest = pwTest.trim();
  pwVerify = pwVerify.trim();
  if (pwTest != pwVerify) {
    document.getElementById("PVMsg").innerHTML = "<font color='red'>Passwords do not match</font>";
    PVCheck = 0;
  } else {
    document.getElementbyId("PVMsg").innerHTML = "";
    PVCheck = 1;
  }
}

<label for="Password">Password: <span id="PWMsg"></span>
            </label>
<input type="password" name="password" placeholder="Enter your Password" onblur="PWVal()" />

<label for="passwordVerify">Verify your Password: <span id="PVMsg"></span>
            </label>
<input type="password" name="passwordVerify" placeholder="Enter in your Password again" onBlur="PVVal()" />

Answer 1

我在PWVal，getElementById和onblur的命名中发现了4种错别字。修正这些拼写错误后，该代码片段似乎可以正常工作，如下所示。退出该字段时，验证工作正常。

此外，在以后遇到此类错误时，值得注意的是首先要检查控制台。错误的函数名称将在那里被召唤，并引导您从正确的路径进行故障排除。

function PWVal() {
  var pwTest = document.getElementsByName("password")[0].value;
  var pwVerify = document.getElementsByName("passwordVerify")[0].value;
  //trim whitespace
  pwTest = pwTest.trim();
  pwVerify = pwVerify.trim();
  if (pwTest != pwVerify) {
    document.getElementById("PVMsg").innerHTML = "<font color='red'>Passwords do not match</font>";
    PVCheck = 0;
  } else {
    document.getElementById("PVMsg").innerHTML = "";
    PVCheck = 1;
  }
}

<label for="Password">Password: <span id="PWMsg"></span>
            </label>
<input type="password" name="password" placeholder="Enter your Password" onblur="PWVal()" />

<label for="passwordVerify">Verify your Password: <span id="PVMsg"></span>
            </label>
<input type="password" name="passwordVerify" placeholder="Enter in your Password again" onblur="PWVal()" />

Answer 2

是PVMsg。我不知道为什么，但是我更改了范围id =“ theMess”，一切按预期开始工作。

谢谢您的帮助。

JS / HTML onblur仅运行一次

2 个答案: