JQuery擴(kuò)展插件Validate 1 基本使用方法并打包下載
分別是:
<script src="../Contents/JS/jquery-1.5.js" type="text/javascript"></script>
<script src="../Contents/JS/jquery.validate.min.js" type="text/javascript"></script>
1、基本使用方法,通過(guò)樣式設(shè)置驗(yàn)證規(guī)則
<script type="text/javascript">
$(function() { $("#signupForm").validate(); }); //驗(yàn)證所選擇的表單
</script>
<p>
<label for="email">Email</label>
<input id="email" name="email" class="required email" />
<!--該項(xiàng)表示電子郵箱是必填的,且是正確的email-->
</p>
<p>
<label for="txtAge">年齡</label>
<input id="txtAge" name="txtAge" min="18" max="45" />
<!--年齡只能在18-45之間-->
</p>
當(dāng)表單提交時(shí),如果沒(méi)有填寫(xiě)email或者是錯(cuò)誤的email將發(fā)生錯(cuò)誤,如下所示:
文本框后面的默認(rèn)提示可以修改jquery.validate.min.js,將英文查找并替換成中文,樣式可以通過(guò)css的類(lèi)樣式改變?nèi)?required,.email等, 當(dāng)然這里的class可以一項(xiàng)或多項(xiàng)中間用空格分隔,語(yǔ)法格式與css一樣,可選擇的項(xiàng)還有:
(1)required:true 必輸字段
(2)remote:"check.php" 使用ajax方法調(diào)用check.php驗(yàn)證輸入值
(3)email:true 必須輸入正確格式的電子郵件
(4)url:true 必須輸入正確格式的網(wǎng)址
(5)date:true 必須輸入正確格式的日期
(6)dateISO:true 必須輸入正確格式的日期(ISO),例如:2009-06-23,1998/01/22 只驗(yàn)證格式,不驗(yàn)證有效性
(7)number:true 必須輸入合法的數(shù)字(負(fù)數(shù),小數(shù))
(8)digits:true 必須輸入整數(shù)
(9)creditcard: 必須輸入合法的信用卡號(hào)
(10)equalTo:"#field" 輸入值必須和#field相同
(11)accept: 輸入擁有合法后綴名的字符串(上傳文件的后綴)
(12)maxlength:5 輸入長(zhǎng)度最多是5的字符串(漢字算一個(gè)字符)
(13)minlength:10 輸入長(zhǎng)度最小是10的字符串(漢字算一個(gè)字符)
(14)rangelength:[5,10] 輸入長(zhǎng)度必須介于 5 和 10 之間的字符串")(漢字算一個(gè)字符)
(15)range:[5,10] 輸入值必須介于 5 和 10 之間
(16)max:5 輸入值不能大于5
(17)min:10 輸入值不能小于10
源碼下載
- jQuery插件formValidator自定義函數(shù)擴(kuò)展功能實(shí)例詳解
- jQuery插件kinMaxShow擴(kuò)展效果用法實(shí)例
- jquery事件機(jī)制擴(kuò)展插件 jquery鼠標(biāo)右鍵事件
- 擴(kuò)展Jquery插件處理mouseover時(shí)內(nèi)部有子元素時(shí)發(fā)生樣式閃爍
- JQuery擴(kuò)展插件Validate—6 radio、checkbox、select的驗(yàn)證
- JQuery擴(kuò)展插件Validate—4設(shè)置錯(cuò)誤提示的樣式
- JQuery擴(kuò)展插件Validate 3通過(guò)參數(shù)設(shè)置錯(cuò)誤信息
- JQuery擴(kuò)展插件Validate 2通過(guò)參數(shù)設(shè)置驗(yàn)證規(guī)則
- JQuery擴(kuò)展插件Validate 5添加自定義驗(yàn)證方法
- jQuery autocomplate 自擴(kuò)展插件、自動(dòng)完成示例代碼
- boxy基于jquery的彈出層對(duì)話框插件擴(kuò)展應(yīng)用 彈出層選擇器
- jQuery插件擴(kuò)展測(cè)試實(shí)例
相關(guān)文章
jQuery Ajax自定義分頁(yè)組件(jquery.loehpagerv1.0)實(shí)例詳解
這篇文章主要介紹了jQuery Ajax自定義分頁(yè)組件(jquery.loehpagerv1.0)實(shí)例詳解,需要的朋友可以參考下2017-05-05jQuery實(shí)現(xiàn)動(dòng)態(tài)添加節(jié)點(diǎn)與遍歷節(jié)點(diǎn)功能示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)動(dòng)態(tài)添加節(jié)點(diǎn)與遍歷節(jié)點(diǎn)功能,結(jié)合實(shí)例形式分析了jQuery針對(duì)頁(yè)面元素節(jié)點(diǎn)元素的動(dòng)態(tài)添加與遍歷相關(guān)操作技巧,需要的朋友可以參考下2017-11-11jQuery ajax dataType值為text json探索分享
ajax dataType值為text json的使用是怎么樣的,在本文將為大家想你想介紹下,感興趣的朋友不要錯(cuò)過(guò)2013-09-09jQuery開(kāi)發(fā)仿QQ版音樂(lè)播放器
這篇文章主要介紹了jQuery開(kāi)發(fā)仿QQ版的音樂(lè)播放器,文中示例代碼非常詳細(xì),幫助大家更好的理解和學(xué)習(xí),感興趣的朋友可以了解下2020-07-07使用jQuery實(shí)現(xiàn)簡(jiǎn)單穿梭框方式
這篇文章主要介紹了使用jQuery實(shí)現(xiàn)簡(jiǎn)單穿梭框方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-10-10jQuery+Ajax實(shí)現(xiàn)無(wú)刷新操作
這篇文章主要介紹了jQuery+Ajax實(shí)現(xiàn)無(wú)刷新操作,分享了采用Ashx+jQuery Ajax實(shí)現(xiàn)“無(wú)刷新登錄”的例子,感興趣的小伙伴們可以參考一下2016-01-01jQuery獲取及設(shè)置表單input各種類(lèi)型值的方法小結(jié)
這篇文章主要介紹了jQuery獲取及設(shè)置表單input各種類(lèi)型值的方法,總結(jié)分析了jQuery針對(duì)表單元素的各種常見(jiàn)操作技巧,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下2016-05-05