Question

我正在尝试构建一个表单，该表单将检查（实时）以查看某个人在输入文本字段时是否与字符串不匹配。实践是用户将数据输入密码表单。

HTML下方：

<div class="form-group">
     <input type="password" name="password" id="password" class="form-control" value="" placeholder="Password" onKeyUp="checkPasswordStrength();">
</div>
<div class="form-group">
      <input type="password" name="vPass" id="cpassword" class="form-control" value="" placeholder="Password">
      <span id="output"></span>
</div>

以下是使用的jQuery：

<script type ="text/javascript">
$("#cpassword").blur(function checkPassMatch(){
    var originEmpt = $("#password").text(""); // Checking if input is empty
    var origin = $("#password").text(); // Password
    var conf = $("#cpassword").text(); // Confirm password
    if (origin != conf){
        $("#output").html("<br /><div class=\"alert alert-danger\" role=\"alert\">Whoops, your passwords don't match!</div>"); //Styling from bootstrap
    } else {
        $("#output").html(""); 
    }
    if (originEmpt){ 
        $("#output").html("<br /><div class=\"alert alert-danger\" role=\"alert\">Please enter a password!</div>"); 
    } else{
        $("#output").html(""); 
    }
})
</script>

通过调试，如果我从jQuery中完全删除了第一个if else语句，我可以根据需要收到$("output").html();。

我尝试过两个输入字段： $("#password").text() / .val(); / .html(); / .innerHTML();

但是代码仍然无法检查一个输入字段是否与另一个输入字段匹配。有什么想法吗？

Answer 1

因为第二次检查输出会覆盖第一次检查。你需要嵌套它：

if (origin != conf){
    $("#output").html("<br /><div class=\"alert alert-danger\" role=\"alert\">Whoops, your passwords don't match!</div>"); //Styling from bootstrap
} else if (!originEmpt){ 
    $("#output").html("<br /><div class=\"alert alert-danger\" role=\"alert\">Please enter a password!</div>"); 
} else{
    $("#output").html(""); 
}

jQuery var没有运作

1 个答案: