Question

我可以使用javascript中的简单匿名函数提交表单并验证它，

 document.getElementById('myForm').onsubmit = function() {
     if(document.getElementById('email').value == "") {
         document.getElementById('errormessage').innerHTML = "Please provide at least an email address";
         return false;
     } else {
         return true; // Note this
     }
 };

在上面使用匿名函数的示例中，我可以简单地在提交文档时分配返回值并阻止提交页面，而在下面的示例中，我使用addEventListener在提交表单时添加事件并通过验证功能进一步评估。我还将返回值设置为true或false，但这种方法似乎不起作用并且页面被提交。我认为我错了返回值

function addEventHandler(node, evt, func) {
    if(node.addEventListener)
        node.addEventListener(evt, func);
    else
        node.attachEvent("on" + evt, func);
}
function initializeAll() {
    addEventHandler(document.getElementById('myform'), 'submit', validate);
}
function validate() {
    if(document.getElementById('email').value == ""){
        document.getElementById("errormessage").innerHTML = "Please provide at least an email ";
        return false;
    } else {
        return true;
    }
}
addEventHandler(window, 'load', initializeAll);

我应该如何以这种方式返回价值，以防止表格提交或提交表格？

Answer 1

你在jQuery下发布了这个问题，所以我将为ya抛出一个jQuery解决方案：

$('#myform').on('submit', function () {
    if($('#email').val() == ""){
        $('#errormessage').html("Please provide at least an email ");
        return false;
    } else {
        return true;
    }
});

请注意，我使用了jQuery 1.7 .on()函数，在这种情况下，它取代了早期版本的.bind()函数。

<强> - 更新 -

以上是上述解决方案的一个方面：http://jsfiddle.net/jasper/LmaYk/

Answer 2

我认为您的问题发生是因为DOM Level 2 Event Registraton与addEventListener一起使用，因此您可以将event.preventDefault()用于Firefox，将event.returnValue=false用于其他浏览器。试试这个演示：

http://jsfiddle.net/pYYSZ/42/

Answer 3

使用类似的东西

<form ...... onsubmit="return your validationFunctionThatReturnTruOrFalse() " >

在提交之前验证表格

3 个答案: