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 面向对象的JavaScript类
May 04 Javascript
解析prototype,JQuery中跳出each循环的方法
Dec 12 Javascript
JavaScript运行过程中的“预编译阶段”和“执行阶段”
Dec 16 Javascript
JavaScript 实现的checkbox经典实例分享
Oct 16 Javascript
javascript动画系列之模拟滚动条
Dec 13 Javascript
jquery dataview数据视图插件使用方法
Dec 23 Javascript
数组Array的一些方法(总结)
Feb 17 Javascript
jQuery滑动到底部加载下一页数据的实例代码
May 22 jQuery
jQuery实现简单的手风琴效果
Apr 17 jQuery
ionic 3.0+ 项目搭建运行环境的教程
Aug 09 Javascript
深入理解react-router 路由的实现原理
Sep 26 Javascript
js事件触发操作实例分析
Jun 21 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通过正则表达式下载图片到本地的实现代码
2011/09/19 PHP
PHP传参之传值与传址的区别
2015/04/24 PHP
ThinkPHP表单数据智能写入create方法实例分析
2015/09/27 PHP
[原创]解决wincache不支持64位PHP5.5/5.6的问题(提供64位wincache下载)
2016/06/22 PHP
PHP调用微博接口实现微博登录的方法示例
2018/09/22 PHP
让GoogleCode的SVN下的HTML文件在FireFox下正常显示.
2009/05/25 Javascript
深入探讨JavaScript、JQuery屏蔽网页鼠标右键菜单及禁止选择复制
2014/06/10 Javascript
jQuery使用slideUp方法实现控制元素缓慢收起
2015/03/27 Javascript
纯jquery实现模仿淘宝购物车结算
2015/08/20 Javascript
JS实现横向与竖向两个选项卡Tab联动的方法
2015/09/27 Javascript
基于javascript实现全屏漂浮广告
2016/03/31 Javascript
javascript鼠标跟随运动3种效果(眼球效果,苹果菜单,方向跟随)
2016/10/27 Javascript
nodejs和php实现图片访问实时处理
2017/01/05 NodeJs
WebPack基础知识详解
2017/01/16 Javascript
如何正确理解javascript的模块化
2017/03/02 Javascript
JavaScript模块模式实例详解
2017/10/25 Javascript
jQuery实现鼠标移入移出事件切换功能示例
2018/09/06 jQuery
vue 本地服务不能被外部IP访问的完美解决方法
2018/10/29 Javascript
Node.js 进程平滑离场剖析小结
2019/01/24 Javascript
python的random模块及加权随机算法的python实现方法
2017/01/04 Python
CentOS 6.5下安装Python 3.5.2(与Python2并存)
2017/06/05 Python
Python数据结构与算法之常见的分配排序法示例【桶排序与基数排序】
2017/12/15 Python
Python学习笔记之抓取某只基金历史净值数据实战案例
2019/06/03 Python
Python 过滤错误log并导出的实例
2019/12/26 Python
PyCharm MySQL可视化Database配置过程图解
2020/06/09 Python
python中count函数知识点浅析
2020/12/17 Python
迪斯尼商品官方网站:ShopDisney
2016/08/01 全球购物
求职简历中的自我评价分享
2013/12/08 职场文书
档案接收函范文
2014/01/10 职场文书
单位成立周年感言
2014/01/26 职场文书
全运会口号
2014/06/20 职场文书
政风行风自查自纠报告
2014/10/21 职场文书
卖房协议书样本
2014/10/30 职场文书
2014年监理工作总结范文
2014/11/17 职场文书
2016年党支部公开承诺书
2016/03/25 职场文书
python中if和elif的区别介绍
2021/11/07 Python