欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

jQuery Validate表單驗(yàn)證插件 添加class屬性形式的校驗(yàn)

 更新時(shí)間：2016年01月18日 16:01:58   作者：daliu_it  
這篇文章主要介紹了jQuery Validate表單驗(yàn)證插件，在class屬性中添加校驗(yàn)規(guī)則進(jìn)行簡(jiǎn)單的校驗(yàn)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

本文實(shí)例介紹了jQuery Validate 表單驗(yàn)證插件，添加class屬性形式的校驗(yàn)，分享給大家供大家參考，具體內(nèi)容如下

效果如下：

一、jQuery表單驗(yàn)證插件，添加class屬性形式的校驗(yàn)

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery表單驗(yàn)證插件----添加class屬性形式的校驗(yàn)</title>
 <script src="../../scripts/jquery-1.3.1.js" type="text/javascript"></script>
 <script src="lib/jquery.validate.js" type="text/javascript"></script>
<style type="text/css">
* { font-family: Verdana; font-size: 96%; }
label { width: 10em; float: left; }
label.error { float: none; color: red; padding-left: .5em; vertical-align: top; }
p { clear: both; }
.submit { margin-left: 12em; }
em { font-weight: bold; padding-right: 1em; vertical-align: top; }
</style>
 <script type="text/javascript">
 $(document).ready(function(){
 $("#commentForm").validate();
 });
 </script>
 
</head>
<body>
 

 <form class="cmxform" id="commentForm" method="get" action="">
 <fieldset>
 <legend>jQuery表單驗(yàn)證插件----添加class屬性形式的校驗(yàn)</legend>
 <p>
 <label for="cusername">姓名</label>
 <em>*</em><input id="cusername" name="username" size="25" class="required" minlength="2" />
 </p>
 <p>
 <label for="cemail">電子郵件</label>
 <em>*</em><input id="cemail" name="email" size="25" class="required email" />
 </p>
 <p>
 <label for="curl">網(wǎng)址</label>
 <em> </em><input id="curl" name="url" size="25" class="url" value="" />
 </p>
 <p>
 <label for="ccomment">你的評(píng)論</label>
 <em>*</em><textarea id="ccomment" name="comment" cols="22" class="required"></textarea>
 </p>
 <p>
 <input class="submit" type="submit" value="提交"/>
 </p>
 </fieldset>
 </form>
</body>
</html>

二、默認(rèn)規(guī)則

默認(rèn)校驗(yàn)規(guī)則：

  • (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                   必須輸入正確格式的日期 日期校驗(yàn)ie6出錯(cuò)，慎用
  • (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

默認(rèn)提示：

messages: {
 required: "This field is required.",
 remote: "Please fix this field.",
 email: "Please enter a valid email address.",
 url: "Please enter a valid URL.",
 date: "Please enter a valid date.",
 dateISO: "Please enter a valid date (ISO).",
 dateDE: "Bitte geben Sie ein g眉ltiges Datum ein.",
 number: "Please enter a valid number.",
 numberDE: "Bitte geben Sie eine Nummer ein.",
 digits: "Please enter only digits",
 creditcard: "Please enter a valid credit card number.",
 equalTo: "Please enter the same value again.",
 accept: "Please enter a value with a valid extension.",
 maxlength: $.validator.format("Please enter no more than {0} characters."),
 minlength: $.validator.format("Please enter at least {0} characters."),
 rangelength: $.validator.format("Please enter a value between {0} and {1} characters long."),
 range: $.validator.format("Please enter a value between {0} and {1}."),
 max: $.validator.format("Please enter a value less than or equal to {0}."),
 min: $.validator.format("Please enter a value greater than or equal to {0}.")
},

本文已被整理到了《jquery表單驗(yàn)證大全》 ，歡迎大家學(xué)習(xí)閱讀。

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助。

相關(guān)文章

最新評(píng)論