jquery判斷輸入密碼兩次是否相等
Jquery easyui是一個非常好的ui框架,但是表單驗證中沒有最常用的判斷兩個輸出框中值相等的驗證,所以我做了下擴展。
$.extend($.fn.validatebox.defaults.rules, { /*必須和某個字段相等*/ equalTo: { validator:function(value,param){ return $(param[0]).val() == value; }, message:'字段不匹配' } });
使用示例:
密碼: <input id="password" name="password" validType="length[4,32]" class="easyui-validatebox" required="true" type="password" value=""/> <br/> 確認密碼:<input type="password" name="repassword" id="repassword" required="true" class="easyui-validatebox" validType="equalTo['#password']" invalidMessage="兩次輸入密碼不匹配"/>
將validType屬性指定為equalTo['#password']即可。
當然使用這個小插件,必須要先引用jquery easyui的js庫。
使用jQuery.validate驗證表單中兩次密碼是否一致的時候遇到了一點小問題,這是我編寫的代碼:
$("#aspnetForm").validate({ rules: { txtName: { required: true }, txtTrueName: { required: true }, txtPass: { required: true, minlength: 3 }, txtTwoPass: { required: true, minlength: 3, equalTo: "#txtPass" }, txtEmail: { required: true, email: true }, txtAddress: { required: true }, txtPhone: { required: true } }, messages: { txtName: { required: "*請輸入用戶名" }, txtTrueName: { required: "*請輸入姓名" }, txtPass: { required: "*請輸入密碼", minlength: "*密碼不能小于3個字符" }, txtTwoPass: { required: "*請輸入確認密碼", minlength: "*密碼不能小于3個字符", equalTo: "*請再次輸入相同的值" }, txtEmail: { required: "*請輸入郵箱", email: "*請輸入正確的郵箱格式" }, txtAddress: { required: "*請輸入地址" }, txtPhone: { required: "*請輸入手機號碼" } } });
為什么明明我輸入的兩次密碼是一致的還一直提示我呢?試過不同的瀏覽器和不同版本的validate都是如此。
不知道大家有沒有遇到類似的問題,我查閱了許多文章,總結了一下解決問題的思路:
- 先去去查看html頁面的兩個password型是否都賦值id了。
- 或者檢索下頁面是否存在兩個txtPass的id。
- 或者你先將equalTo去掉,在重新驗證下,看看是否有存在其他錯誤,沒有在倒回來排查這個地方。
希望這篇文章可以給大家一些啟發(fā),謝謝大家的閱讀,小編一定會再接再厲。
相關文章
jQuery插件echarts實現(xiàn)的循環(huán)生成圖效果示例【附demo源碼下載】
這篇文章主要介紹了jQuery插件echarts實現(xiàn)的循環(huán)生成圖效果,結合完整實例形式分析了echarts插件循環(huán)輸出數(shù)字圖形的實現(xiàn)步驟與相關操作技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下2017-03-03JQuery操作Select的Options的Bug(IE8兼容性視圖模式)
JQuery在IE8兼容性視圖模式下操作Select的Options的Bug在本文進行重現(xiàn)并給出詳細的解決方法,感興趣的朋友可以參考下哈,希望對你有所幫助2013-04-04jquery+ajax實現(xiàn)上傳圖片并顯示上傳進度功能【附php后臺接收】
這篇文章主要介紹了jquery+ajax實現(xiàn)上傳圖片并顯示上傳進度功能,結合實例形式分析了jQuery+ajax結合layer.js插件與php后臺交互,實現(xiàn)顯示上傳進度的相關操作技巧,需要的朋友可以參考下2019-06-06jQuery實現(xiàn)帶延時功能的水平多級菜單效果【附demo源碼下載】
這篇文章主要介紹了jQuery實現(xiàn)帶延時功能的水平多級菜單效果,可實現(xiàn)響應鼠標事件延時展示菜單的功能,涉及jQuery結合時間函數(shù)動態(tài)操作頁面元素屬性的相關技巧,需要的朋友可以參考下2016-09-09jQGrid動態(tài)填充select下拉框的選項值(動態(tài)填充)
這篇文章主要介紹了jQGrid動態(tài)填充select下拉框的選項值(動態(tài)填充)的相關資料,非常不錯,具有參考借鑒價值,需要的朋友可以參考下2016-11-11jQuery實現(xiàn)平滑滾動頁面到指定錨點鏈接的方法
這篇文章主要介紹了jQuery實現(xiàn)平滑滾動頁面到指定錨點鏈接的方法,涉及jquery鼠標事件及頁面滾動的相關技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-07-07