jquery - jquery：防止表单提交 ajax 验证错误

Question

我有一个带有一些 ajax 验证字段的表单。（并非所有字段都使用 ajax 进行验证）

如果其中一个字段出现错误，我想阻止表单提交。

我希望它对于我使用 ajax 验证的其他表单是通用的。

1个标志不会成功。

这是错误时 ajax 字段的样子：

<label id="id_name_lab" class="error">name</label>
<input id="id_name" type="text" maxlength="128" name="name">
<label id="id_name_succ_icn" class="icon_succ" style="display: none;"></label>
<label id="id_name_load_icn" class="icon_load" style="display: none;"></label>

Answer 1

使用 Jquery：

 $("form").submit(function(e) {
                e.preventDefault();
                return false;
 });

没有jQuery：

return false;

在表单的 onsubmit 元素上。

Answer 2

我的想法是使用回调链。

伪代码

$("form").one( "submit", function() {
    var self = this;

    // ajax validation
    $.ajax( /* ... */ )
        .done( function() {
            // call validation, if form is valid, ajaxValidation calls submit again.
            ajaxValidation( self );
        });

    // first submit is always ignored.
    e.preventDefault();
    return false;
});

function ajaxValidation( target ) {
    // check valid & call submit
}

它需要上面的绑定提交处理程序，当你想要的时候。