即使在 onsubmit 函数返回 false 后仍提交表单答案

【问题标题】：Form submitted even after onsubmit function returns false即使在 onsubmit 函数返回 false 后仍提交表单
【发布时间】：2012-03-07 11:20:49
【问题描述】：

HTML

<form action="/users/add" onsubmit="return test();" id="UserForm" method="post" accept-charset="utf-8">
    <input type="text" maxlength="255" value="" id="UserName" class="form-error"  >
</form

Javascript

function test() {
    var inputs = $('input:not([inputname])');

    jQuery.each(inputs, function() {
    if (this.value == '') {
        $(this).next().removeClass('displayNone');
        return false;
    }
    });

}

如果我选择像下面这样的单个输入值，它对我来说很好。它将避免提交表单。

function test() {
    var value = $('#UserName').val();
    if (value == '') {
    $('#UserName').next().removeClass('displayNone');
    return false;
    }
}

使用jQuery.each函数时如何避免表单提交？

【问题讨论】：

标签： jquery html jquery-selectors

【解决方案1】：

在您的第一个示例中，test() 不会返回 false。

test() 函数中没有返回语句。

唯一的返回语句是在传递给each的匿名函数中。

大概你应该做这样的事情：

function test() {
    var inputs = $('input:not([inputname])');

    var return_value = true;

    jQuery.each(inputs, function() {
        if (this.value == '') {
            $(this).next().removeClass('displayNone');
            return_value = false;
        }
    });

    return return_Value;

}

【讨论】：

【解决方案2】：

我认为您应该使用 each() 而不是 $.each()，因为 inputs 它是一个 jquery 集合而不是常规数组。
要防止表单提交，您可以这样做而不是内联代码：

$('form').submit(function(e){
    if (!test()) {
        e.preventDefault(); // If test fails don't submit
    }
});

【讨论】：