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条件下，

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

也可以使用

Answer 3

你不应该向html元素添加事件（onsubmit），而是使用事件处理程序:)我的本机JS在这方面不是很好，我使用jQuery分配：

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

这将成为一切：

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

你确定你的函数返回true / false吗？因为你的内联代码返回函数的返回值，你确定有吗？

如何使用HTML表单中的onsubmit语句正确验证？

3 个答案: