jquery判断输入密码两次是否相等


Posted in Javascript onApril 22, 2020

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去掉,在重新验证下,看看是否有存在其他错误,没有在倒回来排查这个地方。

希望这篇文章可以给大家一些启发,谢谢大家的阅读,小编一定会再接再厉。

Javascript 相关文章推荐
Ext面向对象开发实践(续)
Nov 18 Javascript
SwfUpload在IE10上不出现上传按钮的解决方法
Jun 25 Javascript
JavaScript常用全局属性与方法记录积累
Jul 03 Javascript
jQuery学习笔记之jQuery+CSS3的浏览器兼容性
Jan 19 Javascript
深入了解JavaScript中的Symbol的使用方法
Jul 28 Javascript
angular.js之路由的选择方法
Sep 24 Javascript
ReactJs快速入门教程(精华版)
Nov 28 Javascript
JavaScript实现三级联动菜单实例代码
Jun 26 Javascript
JavaScript实现鼠标滚轮控制页面图片切换功能示例
Oct 14 Javascript
vue远程加载sfc组件思路详解
Dec 25 Javascript
微信小程序利用for循环解决内容变更问题
Mar 05 Javascript
解决vue addRoutes不生效问题
Aug 04 Javascript
基于PHP和Mysql相结合使用jqGrid读取数据并显示
Dec 02 #Javascript
Jqgrid之强大的表格插件应用
Dec 02 #Javascript
整理Javascript事件响应学习笔记
Dec 02 #Javascript
jqGrid表格应用之新增与删除数据附源码下载
Dec 02 #Javascript
通过点击jqgrid表格弹出需要的表格数据
Dec 02 #Javascript
原生JavaScript实现异步多文件上传
Dec 02 #Javascript
Jquery 1.9.1源码分析系列(十二)之筛选操作
Dec 02 #Javascript
You might like
php扩展ZF――Validate扩展
2008/01/10 PHP
PHP下用rmdir实现删除目录的三种方法小结
2008/04/20 PHP
php获取地址栏信息的代码
2008/10/08 PHP
如何批量替换相对地址为绝对地址(利用bat批处理实现)
2013/05/27 PHP
深入理解PHP中的count函数
2016/05/31 PHP
javascript 字符串连接的性能问题(多浏览器)
2008/11/18 Javascript
jQuery与其它库冲突的解决方法
2010/06/25 Javascript
js 创建快捷方式的代码(fso)
2010/11/19 Javascript
jquery选择器的选择使用及性能介绍
2013/01/16 Javascript
jQuery实现点击标题输入详细信息
2013/04/16 Javascript
简单常用的幻灯片播放实现代码
2013/09/25 Javascript
JavaScript实现九九乘法表的简单实例
2016/06/07 Javascript
String字符串截取的四种方式总结
2016/11/28 Javascript
JavaScript定时器制作弹窗小广告
2017/02/05 Javascript
详解vue2.0 使用动态组件实现 Tab 标签页切换效果(vue-cli)
2017/08/30 Javascript
vue中使用ueditor富文本编辑器
2018/02/08 Javascript
使用mint-ui实现省市区三级联动效果的示例代码
2018/02/09 Javascript
vue与vue-i18n结合实现后台数据的多语言切换方法
2018/03/08 Javascript
微信小程序图片右边加两行文字的代码
2020/04/23 Javascript
使用Python的Twisted框架编写简单的网络客户端
2015/04/16 Python
Python 数据结构之旋转链表
2017/02/25 Python
python抽取指定url页面的title方法
2018/05/11 Python
详解10个可以快速用Python进行数据分析的小技巧
2019/06/24 Python
pytorch实现用Resnet提取特征并保存为txt文件的方法
2019/08/20 Python
用sleep间隔进行python反爬虫的实例讲解
2020/11/30 Python
德国街头和运动文化高品质商店:BSTN Store
2017/08/26 全球购物
英国家居装饰品、户外家具和玻璃器皿购物网站:Rinkit.com
2019/11/04 全球购物
技能竞赛活动方案
2014/02/21 职场文书
竞选班长自荐书范文
2014/03/09 职场文书
干部作风建设心得体会
2014/10/22 职场文书
2014年反腐倡廉工作总结
2014/12/05 职场文书
鸟的天堂导游词
2015/01/31 职场文书
微观世界观后感
2015/06/10 职场文书
大学生党课心得体会
2016/01/07 职场文书
Go 语言结构实例分析
2021/07/04 Golang
Ajax实现异步加载数据
2021/11/17 Javascript