2013-01-11 71 views
3

我想驗證輸入,因爲我鍵入,所以我使用onkeyup事件來這樣做,但如果我驗證電子郵件正則表達式「[email protected]」,只要用戶開始鍵入它會拋出一個錯誤 - 第一個字符犯規匹配的正則表達式...驗證電子郵件,你鍵入

所以我寫了這一點:

var addValidation = function (patterns) { 
     var index = patterns.length; //I know I can avoid this 
     while (index--) { 
      patterns[index] = new RegExp(patterns[index]); 
     } 

     index = 0; 
     var current = patterns[index], 
     matchExact = function (patt, str) { 
      var match = str.match(patt); 
      return match !== null && str === match[0]; 
     }; 

     return function() { 
      var str = this.value; 
      if (!matchExact(current, str)) { 
       var tmp = patterns[index + 1] ? 
        new RegExp(current.source + patterns[index + 1].source) : 
        false; 
       if (tmp && matchExact(tmp, str)) { 
        current = tmp; 
        index++; 
       } 
       else { 
        alert("Wrong"); 
       } 
      } 
     } 
    }; 
    document.getElementById("x").onkeyup = addValidation(["[a-zA-Z0-9\\.]+", "@{1}", "[a-zA-Z0-9]+", "\\.{1}", "[a-zA-Z]{1,3}"]); 

看來工作,但...這是醜陋的,它會提醒你,如果你退一步(如「name @」,然後按退格鍵)。

我知道Dojo的驗證非常好,但我不想使用Dojo。有沒有更好的方法來實現這一目標?

//編輯:http://livedocs.dojotoolkit.org/dijit/form/ValidationTextBox這是一個例子,但你可以定義自己的模式(如電子郵件正則表達式),它會完美驗證它。驗證之前

回答

1

添加間隔將開始:

var t; 
document.getElementById("x").onkeyup = function() { 
    if (t) { 
     clearTimeout(t); 
    } 
    t = setTimeout(function() { 
     //do validation 
    }, 1000) 
} 
+0

THAS似乎是一個相當麻煩的,如果會有許多領域。最好使用一些關鍵的動作鏈接事件。 –

+0

不要提到這個代碼。我剛剛展示瞭如何解決這個問題 – CruorVult

0

千萬不要試圖用regualr表達式驗證電子郵件地址。您最終會允許無效的地址,或阻止完全有效的電子郵件地址,並且只會讓您的訪問者煩惱。這也是值得銘記至今用於驗證電子郵件地址最好的正則表達式是這樣的:

http://www.ex-parrot.com/pdw/Mail-RFC822-Address.html

+0

哇,這是一個巨大的! – Tondo