2011-07-11 86 views
0

我構建了用於測試的驗證以確保輸入了正確的零件編號。每個部分都以CAPS中的MR開頭,後跟一個[SPACE]後跟三個數字。例如(先生123)使用帶數字和字母的Jquery進行表單驗證

問題是,如果我似乎無法弄清楚如何使用jquery驗證此。

零件編號始終以MR開頭。

   var type = $("input#type").val(); 

         // Check a that a tank type has been entered. 
         if(type.length < 5 && type.not().contain("MR")){ 

           $("#error_upload").html("Please enter the tank number in a format MR XXX."); 
           $("#type").css({borderColor:'red'}).focus();          
           $("name,#file").css({borderColor:'#ccc'}); 
           return false; 

         } 

任何幫助將是偉大的。

回答

1

我會建議使用正則表達式。

if (type.match(/^MR\s[0-9]{3}$/){ 
... 
} 

基本上,它看起來爲MR,然後的空間(\s),那麼3個數字([0-9]{3})。如果出現其他內容,它將返回false。

+0

這將報告爲正確的[如果輸入的值是'abcMR 123'](http://jsfiddle.net/Shef/QPhSS/)。更新:您在發佈之前編輯過。 :) – Shef

+0

我18分鐘前編輯它?您在14分鐘前發佈了此消息。但是,謝謝:P – switz

+0

顯然,我沒有重新加載頁面。 :) – Shef

1
if (/^MR \d{3}$/.test(subject)) { 
    // Correct tank number format 
} else { 
    // Incorrect tank number format 
} 

這將確保輸入的值永遠只有MR + [SPACE] + 3 digits並不僅如此。

1

有幾條路線,你可以去這裏。

  1. 一個以這種方式編寫審定繼續

    • 你想你的代碼可能看起來像下面

      var type = $("input#type").val(); 
      
      // Check a that a tank type has been entered. 
      if(!/^MR \d{3}$/.test(type)){ 
      
          $("#error_upload").html("Please enter the tank number in a format MR XXX."); 
          $("#type").css({borderColor:'red'}).focus();          
          $("name,#file").css({borderColor:'#ccc'}); 
          return false; 
      
      } 
      
  2. 整合類似的上面到jQuery驗證,因爲我假設你需要在其他地方驗證

  3. 通過只允許3個數字並附加在'MR ' + type上簡化了輸入,因爲其中每一個都需要MR和空間,爲什麼要求用戶輸入它?

    var num = $("input#type").val() 
    , type; 
    
    // Check a that a tank type has been entered. 
    if(!/^\d{3}$/.test(num)){ 
    
        $("#error_upload").html("Please enter the tank number with only digits."); 
        $("#type").css({borderColor:'red'}).focus();          
        $("name,#file").css({borderColor:'#ccc'}); 
        return false; 
    
    } 
    else { 
        type = 'MR ' + num; 
    } 
    
  4. 合併步驟2和3,這將導致在具有這樣<input type="text" class="required digits" maxlength="3" minlength="3" />的輸入。這導致數據輸入較不復雜,而不必擔心簡單的驗證邏輯。這是我最喜歡的選擇。

  5. 使用輸入掩碼來防止用戶從一開始就犯任何錯誤,但它是最「侵入」的。