easyui 判断密码是否输入一致

1.首先要扩展validatebox,添加验证两次密码功能 

$.extend($.fn.validatebox.defaults.rules, {  
            eqPassword:{  
            validator:function(value, param) {  
                return value == $(param[0]).val();  
            },  
            message : '密码不一致!'  
        }  
    });

2.在HTML中要引入eqPassword函数

 <form id="modifyPwdForm" method="post">
            <input name="ids" type="hidden" />
            <table class="tableForm">
                <tr>
                    <th>新密码:</th>
                    <td><input name="cpwd" type="password" class="easyui-validatebox" required="true" missingMessage="请填写新密码" /></td>

                </tr>
                <tr>
                    <th>确认密码:</th>
                    <td><input name="recpwd" type="password" class="easyui-validatebox" required="true" missingMessage="请再次填写新密码" validType="eqPassword['#modifyPwdForm input[name=cpwd]']" /></td>
                </tr>
            </table>
        </form>    

源码:

<!DOCTYPE html>
<html>
  <head>
    <title>password.html</title>
    
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <script type="text/javascript" src="../easyui/jquery.min.js"></script>
    <script type="text/javascript" src="../easyui/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="../easyui/locale/easyui-lang-zh_CN.js"></script>
  
   <link rel="stylesheet" href="../easyui/themes/default/easyui.css" type="text/css"></link>
   <link rel="stylesheet" href="../easyui/themes/icon.css" type="text/css"></link>
    
    <script>
        $.extend($.fn.validatebox.defaults.rules, {  
            eqPassword:{  
            validator:function(value, param) {  
                return value == $(param[0]).val();  
            },  
            message : '密码不一致!'  
        }  
    });
    </script>
  </head>
  
  <body>
    <form id="modifyPwdForm" method="post">
            <input name="ids" type="hidden" />
            <table class="tableForm">
                <tr>
                    <th>新密码:</th>
                    <td><input name="cpwd" type="password" class="easyui-validatebox" required="true" missingMessage="请填写新密码" /></td>

                </tr>
                <tr>
                    <th>确认密码:</th>
                    <td><input name="recpwd" type="password" class="easyui-validatebox" required="true" missingMessage="请再次填写新密码" validType="eqPassword['#modifyPwdForm input[name=cpwd]']" /></td>
                </tr>
            </table>
        </form>    
  </body>
</html>

 

posted @ 2017-09-25 17:24  GumpYan  阅读(760)  评论(0编辑  收藏  举报