為什么我的表單即使返回false仍仍在提交？

Question

我編寫了這段代碼，使用提交按鈕提交了帶有名稱和年齡字段的表單。 我的代碼如下所示：

 function checkForm() { var name = document.forms["form"]["name"].value; var age = document.forms["form"]["age"].value; var regName = /^[AZ]*[az]{3,} $/; var regAge = /^[\\d.*]{1,} $/; if (name == regName && age == regAge) { return true; } else { return false; } } 

 <form name="form" action="register.php" method="POST" onsubmit="return checkForm()"> <p>Name:</p> <input type="text" name="name" id="name"> <br> <p>Age:</p> <input type="text" name="age" id="age"> <br> <br> <button type="submit" name="submit">Submit</button> </form> 

名稱應僅使用大寫和小寫字母，並且年齡必須為數字和正整數。

據說，當我輸入錯誤的數據時，表單不應返回false，而應返回true，然后將我發送到register.php。 我的代碼有問題嗎？

Answer 1

嘗試添加event.preventDefault（）; 當數據無效時。

function checkForm(event){
    var name = document.forms["form"]["name"].value;
    var age = document.forms["form"]["age"].value;
    var regName = /^[A-Z]*[a-z]{3,} $/;
    var regAge = /^[\d.*]{1,} $/;

    if (name == regName && age == regAge){
        return true;

    } else{
   event.preventDefault();
        return false;
    }
}

Answer 2

嘗試使用pattern.test('stringMethod')評估正則表達式

function checkForm(event){
    var name = document.forms["form"]["name"].value;
    var age = document.forms["form"]["age"].value;
    var regName = /^[A-Z]*[a-z]{3,} $/;
    var regAge = /^[\d.*]{1,} $/;
    if (regName.test(name) && regAge.test(age)){
        return true;
    } else{
   event.preventDefault();
        return false;
    }
}

Answer 3

表單的默認行為類似於，如果您在提交時調用一個函數，它將被提交。 因此，您可以在按鈕提交時調用該函數。

<button type="submit" name="submit" onsubmit="return checkForm()">Submit</button>