2010-12-14 45 views
0

我有一個包含兩個textarea的表單,每個表單都涉及一組郵件。當一個檢查在javascript中無效時表單驗證中斷

<form name="myform" action='entryupdate.php' method="post"> 
    <textarea name="mailgroup1" rows="2" cols="50" onchange="checkFormValue();"> 
    </textarea> 
    <textarea name="mailgroup2" rows="2" cols="50" onchange="checkFormValue();"> 
    </textarea> 
    <input name="update" type="submit" value="Update description"/> 
</form> 

我有一個函數來檢查電子郵件是否符合我們的內部規範。

function checkmail(component){ 
    var emailpattern = /^[A-z0-9\._-][email protected][A-z0-9][A-z0-9-]*(\.[A-z0-9_-]+)*\.([A-z]{2,6})$/; 
    var mails = component.value.split(/[\n\r\t ]+/); 
    var valid = true; 
    for(var i=0; i<mails.length; i++){ 
     valid = valid && emailpattern.test(mails[i]); 
     alert("Mail: "+mails[i]+" Valid: "+ emailpattern.test(mails[i])); 
    } 
    if(valid){ 
     component.setAttribute('class', 'valid'); 
    }else{ 
     component.setAttribute('class', 'invalid'); 
    } 
    return valid; 
} 

如果字段已經被類設爲無效,下面的樣式應用:

.invalid 
{ 
background-color:#fffacd; 
} 

當值在textarea的一個改變,下面的函數被調用,檢查是否任何值的格式都不正確,如果是這樣,則提交按鈕將被禁用。

function checkFormValue(){ 
    var validform = true; 
    validform = validform && checkmail(document.myform.mailgroup1) && checkmail(document.myform.mailgroup2); 
    document.hotfixomat.update.disabled = !validform; 
} 

問題是,如果第一次檢查返回false,那麼第二次檢查沒有做,如果它發生了價值格式不正確,那麼改變風格沒有這樣做。 (但提交按鈕被禁用)。爲什麼檢查中斷?

回答

2

這個原因是你如何讓你的validform變量在最後一位。 JavaScript的工作就像許多其他語言,也不會在布爾AND再往前走,如果它不可能是真實的:

var validform = true; 
validform = validform && checkmail(document.myform.mailgroup1) && checkmail(document.myform.mailgroup2); 

如果第一checkmail()是假的,那麼它不具有執行第二個因爲validform將是不可能的。如果您設置了var validform = false,那麼它甚至不會執行任何檢查郵件功能。

一個例子:http://jsfiddle.net/jonathon/Ndw9K/

如果你想確保這兩個被稱爲那麼你可以把它分解起來,做這樣的事情:

var validForm1 = checkmail(document.myform.mailgroup1), 
    validForm2 = checkmail(document.myform.mailgroup2), 
    validForm = validForm1 && validForm2; 

或者,你可以改變你的方法,以便它通過所有你想要驗證的元素,它會改變一個變量並返回它。

一個基本的例子:

function checkmailElements(myarray){ 
    var returnVal = true; 

    for(var i = 0; i< myarray.length; i++){ 
     if(!checkmail(myarray[i])){ 
      returnVal = false; 
     } 
    } 

    returnVal; 
}