2017-02-28 48 views
1

正則表達式驗證在JavaScript與setCustomValidity

var ck_login = new RegExp("/^[a-zA-Z]{5,12}$/"); 
 
var ck_password = new RegExp("/^(?=.*\d)(?=.*[a-z]).{6,16}$/"); 
 

 
function validate(){ 
 
var login = document.getElementById("login").value; 
 
var loginErr = document.getElementById("login"); 
 

 

 
var password = document.getElementById("password").value; 
 
var passwordErr = document.getElementById("password"); 
 

 
if (ck_password.test(password) == false) { 
 
    \t passwordErr.setCustomValidity('Password must have at least 6 characters at least no more than 16. At least one low and one number'); 
 
    \t return false; 
 
} 
 
if (ck_login.test(login) == false) { 
 
    \t loginErr.setCustomValidity('Login must have at least 5 characters and no more than 12'); 
 
    \t return false; 
 
} 
 
return true; 
 

 
}
<form action="" method="post" onSubmit="return validate();"> 
 
    <label>Username:</label> 
 
    <input type="text" name="login" id="login" required="required"> 
 
    <label>Password:</label> 
 
    <input type="text" name="password" id="password" required="required"> 
 
    <input type="submit"> 
 
</form>

我試圖做的表單驗證,其中登錄必須有至少5個字符,不超過12和密碼必須至少有6個字符,至少沒有更多至少有一個低和一個數字。

正則表達式是正確的,但它不是在JavaScript的正常工作。我無法找到我正在做的錯誤。

謝謝。

回答

0

不要創建使用正則表達式構造正則表達式。

做這樣的:

var ck_login = /^[a-zA-Z]{5,12}$/; 
var ck_password = /^(?=.*\d)(?=.*[a-z]).{6,16}$/; 

如果你想用正則表達式構造,不會在字符串的開頭,結尾處使用斜線。

var ck_login = new RegExp("^[a-zA-Z]{5,12}$"); 
var ck_password = new RegExp("^(?=.*\d)(?=.*[a-z]).{6,16}$"); 
+0

好了一些改進,現在它的表現,但另一個問題是,密碼是錯誤的話,就說明錯誤。如果我修復密碼並輸入錯誤的登錄信息並點擊提交,它仍會在密碼框中顯示密碼錯誤。可以製作一段工作代碼片段。感謝 – Phoenix

+0

這是MDN道:「HTMLSelectElement.setCustomValidity()方法設置選擇元件指定的消息自定義有效性消息使用空字符串來表明該元素不具有自定義的有效性的錯誤。」 – mauroc8

+0

只需撥打'loginErr.setCustomValidity( 「」);'和'passwordErr.setCustomValidity( 「」);'權前的'返回true;'聲明。 – mauroc8