Question

我试图编写一个脚本，检查第二个文本字段是否与第一个字段中的数据相同。当用户输入第二个文本字段时，脚本会一直告诉他是否正确。如果通过将label设置为“电子邮件不匹配”，脚本会立即指出错误。

直到现在我还没有成功。

脚本：

window.onload = startChecker;

function startChecker() {
//while(true) {
    if( document.getElementById("first_field").value != "" ) {
        var idFromFirstField = document.getElementById("first_field").value;
          if(idFromFirstField != document.getElementById("second_field").value ) {
              document.getElementById("alert_message").value = "Incorrect Email ! ";
          } else {
              document.getElementById("alert_message").innerHTML = "Two emails match !";
            }
    }
//}
}

如果这是HTML文件：

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="cross_checker.js">
</script>
<title>Untitled Document</title>
</head>

<body>
<form>
<label>Email<input type="text" id="first_field" /></label> <br /> <br />
<label>Verify your Email<input type="text" id="second_field" /></label> &nbsp;&nbsp;
<label id="alert_message" value="" style="color:#CC0000"></label> 
<!--the above label outputs if the user is entering the same id !--->
<br /> <br />
<input type="submit" value="submit" style="color:#CC0000"/>
</form>
</body>
</html>

早些时候我试图使用无限循环但是挂起浏览器，有时浏览器会继续抓取页面。

如何改进此脚本以便我能够立即检查用户是对还是错？

Answer 1

将keyup处理程序添加到input元素。在HTML代码中，添加onkeyup="startChecker();"。

使用JavaScript，您可以通过以下方式动态分配事件处理程序：

if(window.addEventListener) element.addEventListener("keyup", startChecker, true); //All major browsers
else if(window.attachEvent) element.attachEvent("onkeyup", startChecker);
else element.onkeyup = startChecker;
//Where element refers to the HTML element.

在用户输入文本字段的同时检查

1 个答案: