Rumah  >  Artikel  >  hujung hadapan web  >  jQuery Sahkan pemalam pengesahan borang menambah pengesahan dalam bentuk class attribute_jquery

jQuery Sahkan pemalam pengesahan borang menambah pengesahan dalam bentuk class attribute_jquery

WBOY
WBOYasal
2016-05-16 15:19:351574semak imbas

Contoh dalam artikel ini memperkenalkan pemalam pengesahan borang jQuery Validate, menambahkan pengesahan dalam bentuk atribut kelas dan berkongsinya dengan semua orang untuk rujukan anda. Kandungan khusus adalah seperti berikut
Kesannya adalah seperti berikut:

1. Pemalam pengesahan borang jQuery, tambah pengesahan dalam bentuk atribut kelas

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery表单验证插件----添加class属性形式的校验</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表单验证插件----添加class属性形式的校验</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">网址</label>
   <em> </em><input id="curl" name="url" size="25" class="url" value="" />
  </p>
  <p>
   <label for="ccomment">你的评论</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>


2. Peraturan lalai
Peraturan pengesahan lalai:

  • (1)diperlukan:benar Memerlukan medan
  • (2)remote:"check.php" Gunakan kaedah ajax untuk memanggil check.php untuk mengesahkan nilai input
  • (3)emel:true Anda mesti memasukkan e-mel dalam format yang betul
  • (4)url:true Anda mesti memasukkan URL dalam format yang betul
  • (5)date:true Anda mesti memasukkan tarikh dalam format yang betul Terdapat ralat dalam pengesahan tarikh iaitu6, gunakan dengan berhati-hati
  • (6)dateISO:true Anda mesti memasukkan tarikh (ISO) dalam format yang betul, contohnya: 2009-06-23, 1998/01/22 Hanya format yang disahkan, bukan kesahihan
  • (7)nombor:benar Anda mesti memasukkan nombor sah (nombor negatif, perpuluhan)
  • (8)digit:benar Anda mesti memasukkan integer
  • (9)kad kredit: Anda mesti memasukkan nombor kad kredit yang sah
  • (10)equalTo:"#field" Nilai input mestilah sama dengan #field
  • 3bb3ba5d8a8c1e677360c9d603cb067b

  • (12)maxlength:5 Masukkan rentetan dengan panjang maksimum 5 (aksara Cina dikira sebagai satu aksara)

  • (13)minlength:10 Masukkan rentetan dengan panjang minimum 10 (aksara Cina dikira sebagai satu aksara)

  • (14)jangkauan:[5,10] Panjang input mestilah rentetan antara 5 dan 10") (Aksara Cina dikira sebagai satu aksara)

  • (15)julat:[5,10] Nilai input mestilah antara 5 dan 10

  • (16)maks:5                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  

  • (17)min:10 Nilai input tidak boleh kurang daripada 10
  • Gesaan lalai:


Di atas adalah keseluruhan kandungan artikel ini, saya harap ia akan membantu kajian semua orang.

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn