简单验证两次密码输入是否相同

首先介绍需求：场景是用户修改密码，需要输入两次密码以防手误。这里需要验证用户两次输入密码是否一致。

下面是HTML页面代码

<tr>
    <td>新密码</td>
    <td><input type="password" id="NewStaffPwd1" name="NewPwd" required="required" class="onlyNumAlpha" onkeyup="KeyUp()" /></td>
</tr>
<tr>
    <td>重复新密码</td>
    <td><input type="password" id="NewStaffPwd2" required="required" class="onlyNumAlpha" onkeyup="KeyUp()" /></td>
</tr>
<tr>
    <td colspan="2"><input type="submit" id="btnSave" value="修改" /></td>
</tr>
<tr>
    <td colspan="2">
        <span id="errorMsg"></span>
    </td>
</tr>

简单解释一下与本主题无关的标签属性：

name="NewPwd"这里是后台需要接收最终用户的新密码所需要的属性。因为我们已经保证两次输入一致，所以获取任何一个都可以。

required="required"这个属性保证了这里输入的文本为必填

class="onlyNumAlpha"这里的类选择器保证该输入框只能输入字母和数字

<span id="errorMsg"></span>这个是提交后后台返回错误信息的地方

//写到这里的时候，强迫症的我发现代码没有对齐，于是重新插入编辑了一下。

下面是正题

1.注意绑定的事件必须是onKeyUp 不能是onKeyDown或者onKeyPress 这里我们的验证要在用户按键弹回的时候验证，不能在用户的数据输入之前验证。就是说文本框得到数据是在Down之后，Up之前；
2.Javascript代码的使用。区分属性和方法。下面上代码。

function KeyUp() {
            var a = $('#NewStaffPwd1').val();
            //alert(a);
            var b = $('#NewStaffPwd2').val();
            //alert(b);
            if (a == b) {
                $('#btnSave').removeAttr('disabled');
            }
            else {
                $('#btnSave').attr('disabled', 'disabled');
            }
        }

我的之前的错误是把val()方法当成了属性，下面的alert可是帮了我大忙。不信你把val后面的括号去掉试试看alert显示什么。

当然这里设置$('#btnSave')不可用以及令其可用的办法还有很多。

PS:我在之前的代码中已经先让按钮不可用了。