在表單驗證中同時顯示所有錯誤消息

-1

爲什麼我的條件語句無法正常工作？我想同時顯示錯誤消息。在表單驗證中同時顯示所有錯誤消息

function validate() { 
 
    if (firstName.value == "") { 
 
    document.getElementById('error').innerHTML = "*Field is empty"; 
 
    return false; 
 
    } else if (lastName.value == "") { 
 
    document.getElementById('errorTwo').innerHTML = "*Field is empty"; 
 
    return false; 
 
    } else { 
 
    return true; 
 
    } 
 
}

<form name="form" action="action.php" method="post" onsubmit="return validate()"> 
 
    <div class="wrapper"> 
 
    <span>Name</span> 
 
    <br> 
 
    <input type="text" name="firstName" id="firstName" placeholder="First Name" onfocus="this.placeholder=''" onblur="this.placeholder='First Name'" />&nbsp; 
 
    <label id="error"></label> 
 
    <br> 
 
    <input type="text" name="middleName" id="middleName" placeholder="Middle Name (optional)" onfocus="this.placeholder=''" onblur="this.placeholder='Middle Name (optional)'" /> 
 
    <input type="text" name="lastName" id="lastName" placeholder="Last Name" onfocus="this.placeholder=''" onblur="this.placeholder='Last Name'" />&nbsp; 
 
    <label id="errorTwo"></label> 
 
    <br> 
 
    <br> 
 
    </div>

來源

2015-03-31 Juan Carlos De Luna

你錯過了關閉'}'。您是否在[JavaScript控制檯]中看到任何錯誤（http://webmasters.stackexchange.com/questions/8525/how-to-open-the-javascript-console-in-different-browsers）？ – 2015-03-31 14:49:36

您已將腳本標記粘貼到HTML標記範圍之外，這是您的第一個問題，第二個問題是您尚未聲明姓氏或姓氏 – Brad 2015-03-31 14:54:27

對不起，我只是沒有將它包含在我的帖子中，但我已經關閉在我的實際代碼..我沒有任何錯誤，它只是不工作的方式，我想它是 – 2015-03-31 14:54:36

你的條件語句工作正常，但你對它們的理解有點偏離。

的if/else if聲明將停止運行時，條件匹配，因此，如果firstName.value是空的，那麼if聲明將被匹配和代碼將退出那裏，而不是評估條件的休息。

您希望爲每個測試使用獨立的條件語句，而不是返回true或false，而是將變量設置爲true或false，並在條件檢查後返回該條件語句。

所以......

function validate() 
{ 
    var valid = true; 
    if(firstName.value=="") 
    { 
     document.getElementById('error').innerHTML="*Field is empty"; 
     valid = false; 
    } 

    if(lastName.value=="") 
    { 
     document.getElementById('errorTwo').innerHTML="*Field is empty"; 
     valid = false; 
    } 

    return valid; 
}

只是代碼本身的說明，上述評論是正確的爲主，如果你發佈你的整個代碼，你可能會得到更多有用的響應。此外，您可以消除==""部分檢查，只需測試變量的值，因爲空字符串的計算結果爲false。

來源

2015-03-31 15:04:37

非常感謝！有用。 :) – 2015-03-31 15:07:29

不用擔心。希望我所說的一切都對你有意義。如果您有問題，只需詢問，我會盡力回答。 – 2015-03-31 15:08:10

不要鏈的驗證用的if-else否則，如果頭名驗證失敗，那麼你將永遠不會檢查姓氏驗證一起。

來源

2015-03-31 14:57:27

幫助自己:-)

這裏快速的創建的jsfiddle是：

正如其他人所提到的，缺少括號等： http://jsfiddle.net/23tnpve4/1/

你會很容易通過努力看到一些問題
正如其他人所說，如果第一次測試失敗，其他字段不會被檢查，所以錯誤可以通過逐步糾正。
沒有代碼可以刷新錯誤DIV。在新的表格檢查中，必須首先清除錯誤字段。檢查表格是具有幾種可能的啓動狀態的循環。

儘量收集在一個陣列領域的地位，後來他們的工作，像這樣：

window.validate = function() 
{ 
    var firstName = document.getElementById('firstName'); 
    var lastName = document.getElementById('lastName'); 

    // Clear 
    firstName.val(''); 
    lastName.val(''); 

    // Check 
    var errorNames = []; 
    if(firstName.value=="") 
    { 
    errorNames.push('firstName'); 
    } 

    if(lastName.value=="") 
    { 
    errorNames.push('lastName'); 
    } 

    // Inform 
    for (var i=0; i<errorNames.length; i++) { 
    document.getElementById(errorNames[i]).innerHTML="*Field is empty"; 
    } 

    // Return value 
    return errorNames.length == 0; 
}

這段代碼的概念將更加直觀。我沒有檢查它是否有錯別字，這是一個草稿，但我希望它能幫助你。

來源

2015-03-31 15:14:45

在表單驗證中同時顯示所有錯誤消息

回答

相關問題