JQuery擴展插件Validate 2通過參數(shù)設(shè)置驗證規(guī)則
更新時間：2011年09月05日 21:44:22 作者：
在前面示例中使用的的方法簡單方便，但沒有完全將js與頁面結(jié)構(gòu)完全分離，也就是說js依賴了class,下面通過validate()方法的參數(shù)設(shè)置驗證規(guī)則將js與頁面結(jié)構(gòu)完全分離
代碼如下：
<script type="text/javascript">
$(function() {
$("#signupForm").validate(
//在上例中新增的部分
{
rules: {
txtPassword1: "required", //密碼1必填
txtPassword2: { //密碼2的描述多于1項使用對象類型
required: true, //必填，這里可以是一個匿名方法
equalTo: "#txtPassword1", //必須與密碼1相等
rangelength: [5, 10] //長度5-10之間
},
txtEmail: "email" //電子郵箱必須合法
}
});
});
</script>
<form id="signupForm" method="get" action="">
<fieldset>
<legend>用戶注冊</legend>
<p>
<label for="txtPassword1">
密碼1</label>
<input id="txtPassword1" name="txtPassword1" type="password" />
</p>
<p>
<label for="txtPassword2">
密碼2</label>
<input id="txtPassword2" name="txtPassword2" type="password" />
</p>
<p>
<label for="txtEmail">
郵箱</label>
<input id="txtEmail" name="txtEmail" />
</p>
<p>
<input type="submit" value="提交" />
</p>
</fieldset>
</form>
遠行結(jié)果：
注意：在ASP.NET中使用這種JS驗證方法最好將服務(wù)器控件Id替換成客戶端Id,如：<%=控件Id.ClientId %>,<%=控件Id.UniqueId>
源碼下載
復(fù)制代碼 代碼如下:
<script type="text/javascript">
$(function() {
$("#signupForm").validate(
//在上例中新增的部分
{
rules: {
txtPassword1: "required", //密碼1必填
txtPassword2: { //密碼2的描述多于1項使用對象類型
required: true, //必填，這里可以是一個匿名方法
equalTo: "#txtPassword1", //必須與密碼1相等
rangelength: [5, 10] //長度5-10之間
},
txtEmail: "email" //電子郵箱必須合法
}
});
});
</script>
<form id="signupForm" method="get" action="">
<fieldset>
<legend>用戶注冊</legend>
<p>
<label for="txtPassword1">
密碼1</label>
<input id="txtPassword1" name="txtPassword1" type="password" />
</p>
<p>
<label for="txtPassword2">
密碼2</label>
<input id="txtPassword2" name="txtPassword2" type="password" />
</p>
<p>
<label for="txtEmail">
郵箱</label>
<input id="txtEmail" name="txtEmail" />
</p>
<p>
<input type="submit" value="提交" />
</p>
</fieldset>
</form>
遠行結(jié)果：
注意：在ASP.NET中使用這種JS驗證方法最好將服務(wù)器控件Id替換成客戶端Id,如：<%=控件Id.ClientId %>,<%=控件Id.UniqueId>
源碼下載
您可能感興趣的文章:
- jQuery插件formValidator自定義函數(shù)擴展功能實例詳解
- jQuery插件kinMaxShow擴展效果用法實例
- jquery事件機制擴展插件 jquery鼠標(biāo)右鍵事件
- 擴展Jquery插件處理mouseover時內(nèi)部有子元素時發(fā)生樣式閃爍
- JQuery擴展插件Validate—6 radio、checkbox、select的驗證
- JQuery擴展插件Validate—4設(shè)置錯誤提示的樣式
- JQuery擴展插件Validate 3通過參數(shù)設(shè)置錯誤信息
- JQuery擴展插件Validate 1 基本使用方法并打包下載
- JQuery擴展插件Validate 5添加自定義驗證方法
- jQuery autocomplate 自擴展插件、自動完成示例代碼
- boxy基于jquery的彈出層對話框插件擴展應(yīng)用 彈出層選擇器
- jQuery插件擴展測試實例
相關(guān)文章
比較不錯的用ajax加載css或js等文件的源代碼，以前都是需要把代碼放到網(wǎng)頁中，使用這個控件就不需要。2009-05-05
這篇文章主要介紹了jQuery解析json格式數(shù)據(jù)的方法,結(jié)合實例分析了使用jQuery1.7.2版本的方法解析json格式數(shù)據(jù)的技巧,需要的朋友可以參考下2016-01-01
jquery Deferred 快速解決異步回調(diào)的問題
下面小編就為大家?guī)硪黄猨query Deferred 快速解決異步回調(diào)的問題。小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-04-04
這篇文章主要介紹了jquery驗證郵箱格式并顯示提交按鈕，只有輸入email地址正確才顯示提交按鈕演示，感興趣的小伙伴們可以參考一下2015-11-11
JQuery slideshow的一個小問題(如何發(fā)現(xiàn)及解決過程)
在做一個網(wǎng)頁homepage的時候，想用slideshow［1］做圖片切換效果,在打開頁面所以的正常測試都沒問題:當(dāng)瀏覽器同時打開多個tab，停留他tab中的頁面一段時間后，會出現(xiàn)圖片是最后一張圖片,針對這個問題，本文給予了詳細的解決方法，感興趣的朋友可以了解下2013-02-02
這篇文章主要介紹了jQuery實現(xiàn)動態(tài)刪除LI的方法,結(jié)合實例形式分析了jQuery針對頁面元素動態(tài)操作相關(guān)實現(xiàn)技巧,需要的朋友可以參考下2017-05-05
jQuery動態(tài)創(chuàng)建html元素的常用方法匯總
這篇文章主要介紹了jQuery動態(tài)創(chuàng)建html元素的常用方法,包括jQuery追加元素、遍歷數(shù)組以及使用模板等方法,非常具有實用價值,需要的朋友可以參考下2014-09-09
這篇文章主要介紹了jquery使用jxl插件導(dǎo)出excel的具體實現(xiàn)步驟,需要的朋友可以參考下2014-04-04
jquery對Json的各種遍歷方法總結(jié)(必看篇)
下面就為大家?guī)硪黄猨query對Json的各種遍歷方法總結(jié)(必看篇)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-09-09
這篇文章主要介紹了jQuery隨機密碼生成的方法,實例分析了jQuery操作隨機數(shù)的技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-03-03