[jQuery]Validation驗證plugin的應用

作者: fase 日期: 2013-04-09 10:45

字體大小: 小中大

Validation plugin網路上已經很多資料了
雖然我要寫的內容不是基本應用
但網路上還是可以找到蠻多的
不過怕自己忘記
還是來整理整理
這裏要用的是addMethod和addClassRules
此驗證plugin雖然內建一些驗證方法
但難免還是不足
那要怎麼辦呢
那就只好自行建立了
而此plugin剛好提供方法可以擴增規則
以下就是要說明這個
先來看看程式碼吧
<script type="text/javascript">
  $(document).ready(function() {
   $.validator.addMethod("regex", function(value, element, param) {
     return value.match(new RegExp("^" + param + "$"));
   });
   $.validator.addClassRules("acc", {
   required: true,
   minlength: 4,
        regex: "[A-Za-z0-9]+"
   });
   $("#sendform").validate();
  });
</script>
再來看看輸入框
<input type="text" name="account" id="account" value="" class="acc" />
這裏是要增加一個帳號的驗證，只能輸入英文和數字，並至少4位以上
所以就先利用addMethod來增加一個方法能夠應用正規運算式
再來利用addClassRules增加一個規則，並內含之前加的方法並加上正規運算式
最後在輸入框利用class來代入剛建的規則
這樣就可以了

好像又寫的有點複雜
不過稍微試一下應該就會知道吧