Question

我有2个文本框。第一个用于新密码，旧用于确认新密码。

<script>
    var old = $("#old").val();
    var newPass = $("#new_pass").val();
    var ConfirmPass = $("#confirm_pass").val();

    $("#confirm_pass").keyup(function () {
        if (this.value == newPass) {
            $("#check").toggleClass('fa-times fa-check')
        }

    });
</script>

当用户输入新的密码时，请输入确认密码文本框，我需要将标签从fa fa-times更改为fa fa-check。

但是当我把光标放在确认文本框内时，它会转换为fa fa-check而不输入任何内容。

Answer 1

我建议你在绑定事件中移动变量，因为它在doc就绪时总是为空，为了确保元素可用，将事件包装在doc ready块中。

 $(document).ready(function(){

      $("#confirm_pass").keyup(function(e){

              // now put the code here with all vars

       });


 });

Answer 2

您只获得一次所有价值。您应该使用keyup函数中的所有值，如下所示。

$("#confirm_pass").keyup(function () {
    var old = $("#old").val();
    var newPass = $("#new_pass").val();

    if (this.value == newPass) {
        $("#check").removeClass('fa-times').addClass('fa-check');
    } else {
        $("#check").removeClass('fa-check').addClass('fa-times');
    }
});

Answer 3

这是因为你正在使用切换。你可以这样做：

if(this.value == newPass)
{
  $("#check").addClass('fa-check');
  $("#check").removeClass('fa-times');
} else {
  $("#check").removeClass('fa-check');
  $("#check").addClass('fa-times');
}

Answer 4

这里有两个问题。首先，在进行比较检查之前，应该在页面加载时检索#new_pass的值。此外，您只需在检查有效时设置类，您还需要为有效密码的人提供服务，然后添加/删除某个字符并使其再次无效。试试这个：

$("#confirm_pass").keyup(function() {
    var newPass = $("#new_pass").val();
    $("#check").toggleClass('fa-times fa-check', this.value == newPass)
});

Answer 5

添加到之前的答案中，您应该使用$("#confirm_pass").focusout()而不是keyup()，因为每次输入新字符时都不需要检查。

$(document).ready(function() { $("#confirm_pass").focusout(function() { var old = $("#old").val(); var newPass = $("#new_pass").val(); if (this.value === newPass) { $("#check").addClass('fa-check'); } else { $("#check").addClass('fa-times'); } }); });

jsFiddle

P.S。：这应该是一个评论，但我还没有足够的声誉。

检查新密码是否与确认新密码文本框相同

5 个答案: