jquery validate在ie8下的bug解決方法
更新時(shí)間：2013年11月13日 16:04:20 作者：
項(xiàng)目用到了jquery的表單校驗(yàn)插件validate，但在ie8下有bug，下面有個(gè)不錯(cuò)的解決方法，需要的朋友可以參考下
項(xiàng)目用到了jquery的表單校驗(yàn)插件validate，之前一直都只是做很簡單的校驗(yàn)，沒有做過稍微復(fù)雜的應(yīng)用，近期項(xiàng)目對(duì)應(yīng)用的要求提高了，一個(gè)頁面中有兩個(gè)提交按鈕，然后表單校驗(yàn)是綁定在按鈕的點(diǎn)擊事件上的，如下。
然后很自然的就用到了插件的valid()函數(shù)：
這個(gè)確實(shí)能達(dá)到相要的效果，但是在ie8下竟然有問題，valid（）方法始終返回false，而且所有的字段都會(huì)被當(dāng)成必填字段校驗(yàn)，糾結(jié)了好久，因?yàn)閖query的插件代碼都很復(fù)雜，所以剛開始看特別費(fèi)勁，后來一步一步排查，找到問題了，問題出在attributeRules（）函數(shù)上：
這個(gè)函數(shù)的作用是：當(dāng)你把校驗(yàn)規(guī)則寫在頁面上而不是腳本里面時(shí)，同樣可以應(yīng)用校驗(yàn)框架。技術(shù)上是很合理的，對(duì)required的處理也是合理的，但是對(duì)于ie8來說，就有點(diǎn)問題了。ie8會(huì)執(zhí)行以下分支：
所以，所有的字段都會(huì)被當(dāng)成必填字段校驗(yàn)了。經(jīng)過測(cè)試，最后又兩種方法可以解決：
第一種是在rules()方法里面找到下面這段代碼，注釋掉對(duì)attributeRules（）的調(diào)用，之所以可以這樣做，是因?yàn)橐话愫苌贂?huì)把校驗(yàn)寫到頁面中去，當(dāng)然這個(gè)肯定不是最佳解決方案，那就看看第二種。
第二種解決方法需要做兩件事情：首先，需要對(duì)attributeRules（）方法做一些修改，把getAttribute()方法換成attr()方法。注意getAttribute()是js方法，而attr()是jquery方法，它們的使用對(duì)象是不一樣的，其實(shí)這樣改完后，ie8下面的bug已經(jīng)解決了，但是ie7下又出現(xiàn)了這種問題，所以你要用最新的jquery，我測(cè)試的時(shí)候用的是jquery1.10.2版本。
哦，對(duì)了，最后不要忘記阻止表單的默認(rèn)事件。
然后很自然的就用到了插件的valid()函數(shù)：
這個(gè)確實(shí)能達(dá)到相要的效果，但是在ie8下竟然有問題，valid（）方法始終返回false，而且所有的字段都會(huì)被當(dāng)成必填字段校驗(yàn)，糾結(jié)了好久，因?yàn)閖query的插件代碼都很復(fù)雜，所以剛開始看特別費(fèi)勁，后來一步一步排查，找到問題了，問題出在attributeRules（）函數(shù)上：
這個(gè)函數(shù)的作用是：當(dāng)你把校驗(yàn)規(guī)則寫在頁面上而不是腳本里面時(shí)，同樣可以應(yīng)用校驗(yàn)框架。技術(shù)上是很合理的，對(duì)required的處理也是合理的，但是對(duì)于ie8來說，就有點(diǎn)問題了。ie8會(huì)執(zhí)行以下分支：
所以，所有的字段都會(huì)被當(dāng)成必填字段校驗(yàn)了。經(jīng)過測(cè)試，最后又兩種方法可以解決：
第一種是在rules()方法里面找到下面這段代碼，注釋掉對(duì)attributeRules（）的調(diào)用，之所以可以這樣做，是因?yàn)橐话愫苌贂?huì)把校驗(yàn)寫到頁面中去，當(dāng)然這個(gè)肯定不是最佳解決方案，那就看看第二種。
第二種解決方法需要做兩件事情：首先，需要對(duì)attributeRules（）方法做一些修改，把getAttribute()方法換成attr()方法。注意getAttribute()是js方法，而attr()是jquery方法，它們的使用對(duì)象是不一樣的，其實(shí)這樣改完后，ie8下面的bug已經(jīng)解決了，但是ie7下又出現(xiàn)了這種問題，所以你要用最新的jquery，我測(cè)試的時(shí)候用的是jquery1.10.2版本。
哦，對(duì)了，最后不要忘記阻止表單的默認(rèn)事件。
您可能感興趣的文章:
- JQuery擴(kuò)展插件Validate—6 radio、checkbox、select的驗(yàn)證
- jQuery EasyUI API 中文文檔 - ValidateBox驗(yàn)證框
- jQuery.Validate驗(yàn)證庫的使用介紹
- Jquery Validate 正則表達(dá)式實(shí)用驗(yàn)證代碼大全
- jquery內(nèi)置驗(yàn)證(validate)使用方法示例(表單驗(yàn)證)
- jquery validate添加自定義驗(yàn)證規(guī)則(驗(yàn)證郵箱 郵政編碼)
- 使用jquery.validate自定義方法實(shí)現(xiàn)"手機(jī)號(hào)碼或者固話至少填寫一個(gè)"的邏輯驗(yàn)證
- jQuery驗(yàn)證插件 Validate詳解
- 基于Bootstrap+jQuery.validate實(shí)現(xiàn)Form表單驗(yàn)證
- jQuery插件Validate實(shí)現(xiàn)自定義校驗(yàn)結(jié)果樣式
相關(guān)文章
jQuery實(shí)現(xiàn)首頁圖片淡入淡出效果的方法
這篇文章主要介紹了jQuery實(shí)現(xiàn)首頁圖片淡入淡出效果的方法,實(shí)例分析了jQuery圖片淡入淡出效果的相關(guān)使用技巧,需要的朋友可以參考下2015-06-06
jQuery?v3.3.1的BUG以及解決辦法(附解決方案)
這篇文章描述了我們?FineUIPro?產(chǎn)品?更新中遇到的一個(gè)問題，最終將問題定位到?jQuery.position()?函數(shù)，雖然jQuery的做法是依照HTML規(guī)范來的，但是?jQuery.offsetParent()?和?jQuery.position()?兩個(gè)函數(shù)有沖突，并且會(huì)導(dǎo)致之前的jQuery插件出錯(cuò)，應(yīng)該算是一個(gè)BUG吧2023-03-03
利用div+jquery自定義滾動(dòng)條樣式的2種方法
可以設(shè)置左邊菜單項(xiàng)div的overflow-x:auto;overlfow-y:auto;這樣就會(huì)自動(dòng)生成了滾動(dòng)條，但是大家都知道自帶的不好看。接下來就是重點(diǎn)了，如何修改滾動(dòng)條的樣式呢？感興趣的朋友可以了解下本文2013-07-07
Jquery 綁定時(shí)間實(shí)現(xiàn)代碼
jquery 顯示本地時(shí)間/ 帶日期、星期/ UTC，需要的朋友可以參考下。2011-05-05
下面小編就為大家?guī)硪黄猨query分隔Url的param方法(推薦)。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-05-05
這篇文章主要介紹了單擊和雙擊事件的沖突處理方法,需要的朋友可以參考下2014-04-04
jquery DIV撐大怎么讓滾動(dòng)條滾到最底部，類似問題想必大家都有遇到過吧，下面與大家分享下具體的處理代碼，感興趣的朋友可以了解下哈2013-06-06
jquery實(shí)現(xiàn)的橫向二級(jí)導(dǎo)航效果代碼
這篇文章主要介紹了jquery實(shí)現(xiàn)的橫向二級(jí)導(dǎo)航效果代碼,可實(shí)現(xiàn)鼠標(biāo)滑過導(dǎo)航出現(xiàn)下拉菜單切換的效果,非常簡潔自然,涉及jquery鼠標(biāo)hover事件及頁面元素樣式的動(dòng)態(tài)改變技巧,需要的朋友可以參考下2015-08-08
20個(gè)非常棒的Jquery實(shí)用工具 國外文章
網(wǎng)站設(shè)計(jì)者往往會(huì)設(shè)計(jì)一些小的工具類（widgets）或者一些可復(fù)用的程序，從而使頁面更楚楚動(dòng)人，更吸引瀏覽者駐足。這里收集了20個(gè)常用Jquery工具類，這些小的工具可以幫助網(wǎng)站設(shè)計(jì)人員和站長非常容易地創(chuàng)建漂亮的站點(diǎn)。2010-01-01
這篇文章主要介紹了淺析jQuery EasyUI中的tree的用法,是根據(jù)個(gè)人對(duì)此的理解來實(shí)現(xiàn)的，需要的朋友可以參考下2014-12-12