驗證表單域

爲什麼此代碼表示在填寫所有字段時填寫所有值？當它們實際上是空的時，它應該只給「填寫所有字段」消息。驗證表單域

<html> 
<head> 
<title>javascript</title> 
</head> 
<body> 
<h1>test page</h1> 
<hr> 
<script type="text/javascript"> 
function checkForm(form) { 
    for(var i = 0; i<form.elements.length; i++) { 
     if(form.elements[i].value == "") { 
      alert("Please fill out all fields."); 
      return false; 
     } 
    } 
    return true; 
} 
</script> 

<form onSubmit="return checkForm(this)"> 
<input type="text" name="firstName"><br> 
<input type="text" name="lastName"> 
<input type="submit"> 
</form> 
</body> 
</html>

來源

2012-02-19 droidus

提交按鈕是一個表單元素，你沒有給它一個值。因此，JS通過輸入循環，進入提交按鈕，找不到任何值，並引發警報。

嘗試：

function checkForm(form) { 
    for(var i = 0; i<form.elements.length; i++) { 
     if(form.elements[i].type == "input" && form.elements[i].value == "") { 
      alert("Please fill out all fields."); 
      return false; 
     } 
    } 
    return true; 
}

來源

2012-02-19 02:43:15 Mala

這是因爲你的代碼是檢查每輸入字段，在這種情況下也提交按鈕。你的函數改成這樣：

function checkForm(form) { 
    for (var i = 0; i < form.elements.length; i++) { 
     if (form.elements[i].value == "" && form.elements[i].type != 'submit') { 
      alert("Fill out ALL fields."); 
      return false; 
     } 
    } 
    return true; 
}

來源

2012-02-19 02:45:50 j08691

你可能不希望在「不服從」爲如果表單有複選框和/或單選按鈕，這將會跳出 – Mala 2012-02-19 02:46:55

@Mala - 表單沒有這些。如果是的話，我會爲他們編碼。只要按照OP的代碼進行即可。謝謝。 – j08691 2012-02-19 02:52:15

是公平的，但在我看來，最好有一個函數在語義上與它似乎做的相匹配 - 否則你可能只需要對元素[0]和[1]進行硬編碼檢查，因爲它會更短，更快，並且仍然可以使用提供的代碼。 – Mala 2012-02-19 03:40:28

您還檢查以確保提交按鈕填充試試這個：

function checkForm(form) { 
    var win = true; 
    elements = form.elements; 
    for(var i = 0; i<elements.length; i++) { 
     if(elements[i].value == "" && elements[i].type != "submit") { 
      win = false; 
     } 
    } 
    if(!win){ 
     alert("please fill out ALL fields!"); 

    } 
    return win; 
}

來源

2012-02-19 02:47:58 raser

回答

相關問題