如何使用HTML表單中的onsubmit語句正確驗證？

Question

我正在嘗試使用我編寫的一些JavaScript代碼驗證HTML表單，但是當我使用此標記創建表單時

    <form name="inputForm" action="http://postcatcher.in/catchers/51eefe8cd1c7b60200000530" method="post" onsubmit="return validateForm()">

盡管違反了我編寫的validateForm（）函數中詳述的條件，但該表單仍可以提交。 我已經四重檢查了該功能，並且我幾乎肯定那里沒有任何問題。 我是在這里錯誤地使用某種語法還是在其他地方出現問題？

編輯：簡而言之，這是validateForm（）函數

function validateForm() {
if(document.inputForm.Title===null || document.inputForm.Title==="") {
    alert("Title required");
    document.inputForm.Title.focus();
    return false;
}
}

編輯2：問題與發布的代碼無關，我忘記為表單中的一個字段設置ID。

Answer 1

我使用相同的邏輯來防止使用javascript雙擊。 如果表單無效，請確保函數ValidateForm返回false。

我的例子：

function FirstSubmitOnly() 
    {
        if (haveSubmitted)
             return false;

        haveSubmitted = true;
        return true;
    }

Answer 2

您必須使用對象的value屬性。

document.inputForm.Title.value

所以你的js應該像

function validateForm() {
if(document.inputForm.Title.value===null || document.inputForm.Title.value==="") {
    alert("Title required");
    document.inputForm.Title.focus();
    return false;
}
}

而且， document.inputForm.Title.value永遠不會為null 。 所以如果有條件

if(document.inputForm.Title.value==="")

也會工作

Answer 3

您不應該將事件（onsubmit）添加到html元素中，而應使用事件處理程序:)我的本機JS在這一方面不太好，我使用jQuery allot：

$(document).on('submit', '#form', function(event){
    if( validateForm() !== true ){ event.preventDefault(); } 
});

這將是所有的事情：

document.getElementById("form").onsubmit=function(){ 
    return validateForm()}; 
}

您確定函數返回true / false嗎？ 因為您的內聯代碼返回該函數的返回值，所以您確定有任何返回值嗎？