JavaScript表單驗證返回false錯誤

Question

我正在嘗試做一個表單，並且在彈出警報時，它仍在提交。 我如何停止提交？

 function validate() { var first = document.register.first.value; if (first == "") { alert("please enter your name"); first.focus(); return false; } return (true); }

 <body> <form name="register" action="testform.php" onsubmit="return(validate());"> <input type="text" name="first" /> <button type="submit" />Submit </form> </body>

Answer 1

您在return（）上添加了括號，然后在調用該函數時在我們使用() return(validate())上添加了括號，因此它可能正在考慮return一個自定義函數，該函數返回undefined，當返回undefined時，它將忽略並繼續執行。 驗證的調用方式如何，但其響應不會返回到表單。

固定版本：

<head>
<script>
function validate(e) {
   var first = document.register.first.value;
   console.log(document.register.first)
    if( first == "" ) {
        alert( "please enter your name" ) ;
        return false;
    }
return(true);
}
</script>
</head>
<body>
    <form name="register" action="testform.php" onsubmit="return validate()">
        <input type="text" name="first" />
        <button type="submit" >sbmit</button>
    </form>
</body>

Answer 2

最好在事物的前端使用required屬性。 在提交之前，它將“強迫”用戶在輸入字段中輸入文本。 請注意，我在'force'一詞周圍加上了引號，因為您可以編輯HTML並避開HTML required屬性。 因此，絕對要確保您也在PHP方面驗證用戶輸入 。

許多教程和示例PHP表單驗證存在，如這一個從W3Schools的和這個來自中等。

 <form name="register" action="testform.php"> <input type="text" name="first" required/> <input type="submit" value="Submit"/> </form>

Answer 3

我認為問題出在按鈕的type="submit" 。 嘗試使用onclick函數將其更改為type="button" ，如果validate()返回true ，則該函數會提交您的表單。

編輯：Arjan有一個很好的觀點，您應該使用required 。 但這回答了為何提交表單。

Answer 4

您的代碼中有幾個錯誤。

<button>元素未自動關閉
您正在調用focus於輸入值，而不是引發異常的輸入元素

function validate() {
   var input = document.register.first;
   var text = input.value;   
    if( text == "" ) {
        alert( "please enter your name" ) ;
        input.focus();
        return false;
    }
    return true;
}

JavaScript表單驗證返回false錯誤

問題描述

4 個解決方案

解決方案1
1 2018-12-21 13:25:43

解決方案2
0 2018-12-21 13:12:59

解決方案3
0 2018-12-21 13:16:18

解決方案4
0 2018-12-21 13:21:35

JavaScript表單驗證返回false錯誤

問題描述

4 個解決方案

解決方案1 1 2018-12-21 13:25:43

解決方案2 0 2018-12-21 13:12:59

解決方案3 0 2018-12-21 13:16:18

解決方案4 0 2018-12-21 13:21:35

解決方案1
1 2018-12-21 13:25:43

解決方案2
0 2018-12-21 13:12:59

解決方案3
0 2018-12-21 13:16:18

解決方案4
0 2018-12-21 13:21:35