jquery validate在ie8下的bug解决方法


Posted in Javascript onNovember 13, 2013

项目用到了jquery的表单校验插件validate,之前一直都只是做很简单的校验,没有做过稍微复杂的应用,近期项目对应用的要求提高了,一个页面中有两个提交按钮,然后表单校验是绑定在按钮的点击事件上的,如下。
jquery validate在ie8下的bug解决方法 
然后很自然的就用到了插件的valid()函数:
jquery validate在ie8下的bug解决方法 
这个确实能达到相要的效果,但是在ie8下竟然有问题,valid()方法始终返回false,而且所有的字段都会被当成必填字段校验,纠结了好久,因为jquery的插件代码都很复杂,所以刚开始看特别费劲,后来一步一步排查,找到问题了,问题出在attributeRules()函数上:
jquery validate在ie8下的bug解决方法 
这个函数的作用是:当你把校验规则写在页面上而不是脚本里面时,同样可以应用校验框架。技术上是很合理的,对required的处理也是合理的,但是对于ie8来说,就有点问题了。ie8会执行以下分支:
jquery validate在ie8下的bug解决方法 
所以,所有的字段都会被当成必填字段校验了。经过测试,最后又两种方法可以解决:

第一种是在rules()方法里面找到下面这段代码,注释掉对attributeRules()的调用,之所以可以这样做,是因为一般很少会把校验写到页面中去,当然这个肯定不是最佳解决方案,那就看看第二种。
jquery validate在ie8下的bug解决方法 
第二种解决方法需要做两件事情:首先,需要对attributeRules()方法做一些修改,把getAttribute()方法换成attr()方法。注意getAttribute()是js方法,而attr()是jquery方法,它们的使用对象是不一样的,其实这样改完后,ie8下面的bug已经解决了,但是ie7下又出现了这种问题,所以你要用最新的jquery,我测试的时候用的是jquery1.10.2版本。
jquery validate在ie8下的bug解决方法 
哦,对了,最后不要忘记阻止表单的默认事件。

Javascript 相关文章推荐
JavaScript 申明函数的三种方法 每个函数就是一个对象(一)
Dec 04 Javascript
JS动态获取当前时间,并写到特定的区域
May 03 Javascript
jQuery.lazyload+masonry改良图片瀑布流代码
Jun 20 Javascript
firefox浏览器用jquery.uploadify插件上传时报HTTP 302错误
Mar 01 Javascript
jquery验证邮箱格式并显示提交按钮
Nov 07 Javascript
jQuery获取浏览器类型和版本号的方法
Jul 05 Javascript
Bootstrap fileinput文件上传预览插件使用详解
May 16 Javascript
基于VUE选择上传图片并页面显示(图片可删除)
May 25 Javascript
vue项目首屏加载时间优化实战
Apr 23 Javascript
vue-model实现简易计算器
Aug 17 Javascript
ES5和ES6中类的区别总结
Dec 21 Javascript
JS前端可视化canvas动画原理及其推导实现
Aug 05 Javascript
JQuery伸缩导航练习示例
Nov 13 #Javascript
JS:window.onload的使用介绍
Nov 13 #Javascript
JQuery each打印JS对象的方法
Nov 13 #Javascript
Jquery 数组操作大全个人总结
Nov 13 #Javascript
JS保存和删除cookie操作 判断cookie是否存在
Nov 13 #Javascript
js 判断上传文件大小及格式代码
Nov 13 #Javascript
php跨域调用json的例子
Nov 13 #Javascript
You might like
php中通过数组进行高效随机抽取指定条记录的算法
2013/09/09 PHP
php读取csv实现csv文件下载功能
2013/12/18 PHP
PHP实现微信公众平台音乐点播
2014/03/20 PHP
php读取大文件示例分享(文件操作类)
2014/04/13 PHP
Linux系统中设置多版本PHP共存配合Nginx服务器使用
2015/12/21 PHP
WordPress中创建用户角色的相关PHP函数使用详解
2015/12/25 PHP
PHP针对多用户实现更换头像功能
2016/09/04 PHP
PHP接入微信H5支付的方法示例
2019/10/28 PHP
PHP生成随机密码4种方法及性能对比
2020/12/11 PHP
对YUI扩展的Gird组件 Part-1
2007/03/10 Javascript
3款实用的在线JS代码工具(国外)
2012/03/15 Javascript
求数组最大最小值方法适用于任何数组
2013/08/16 Javascript
js二维数组排序的简单示例代码
2014/01/24 Javascript
教你用AngularJS框架一行JS代码实现控件验证效果
2014/06/23 Javascript
javascript:void(0)是什么意思及href=#与href=javascriptvoid(0)的区别
2015/11/13 Javascript
详解handlebars+require基本使用方法
2016/12/21 Javascript
JS实现的文件拖拽上传功能示例
2018/05/21 Javascript
elementUI中Table表格问题的解决方法
2018/12/04 Javascript
JavaScript惰性求值的一种实现方法示例
2019/01/11 Javascript
js如何获取访问IP、地区、当前操作浏览器
2019/07/23 Javascript
Vue中正确使用Element-UI组件的方法实例
2020/10/13 Javascript
python批量添加zabbix Screens的两个脚本分享
2017/01/16 Python
Python3中使用PyMongo的方法详解
2017/07/28 Python
用python实现k近邻算法的示例代码
2018/09/06 Python
使用python批量化音乐文件格式转换的实例
2019/01/09 Python
django中media媒体路径设置的步骤
2019/11/15 Python
python实现字符串和数字拼接
2020/03/02 Python
一款简洁的纯css3代码实现的动画导航
2014/10/31 HTML / CSS
解决方案设计综合面试题
2015/08/31 面试题
人力资源管理求职信
2014/08/07 职场文书
小学生竞选班干部演讲稿(5篇)
2014/09/12 职场文书
自查自纠工作总结
2014/10/15 职场文书
学生违纪检讨书200字
2014/10/21 职场文书
2014年机关党建工作总结
2014/11/11 职场文书
华山导游词
2015/02/03 职场文书
教师实习自我鉴定总结
2019/08/20 职场文书