使用 jQuery 在提交时阻止表单重定向，直到函数完成

Question

有没有办法使用 jQuery 强制表单等到函数执行完成后再提交？

我在多字段表单上有一个提交按钮。我希望提交按钮点击服务器以确定当前用户是否在数据库中有任何项目，如果没有，我希望它弹出一个确认窗口以确保用户知道。如果他们已经有一些项目，我希望它跳过弹出窗口并正常提交。

我正在使用这样的东西：

$('#done').click(function(event)
{
    $.post(asyncController + "/checkItems", function(response)
            {
                if(response != "true")
                {
                    var test = confirm('Are you sure?');
                    if(test)
                    {
                        //submit
                    } else
                    {
                        event.preventDefaultAction();
                    }
                }
            }
        );
});

不幸的是，表单没有等待 javascript 完成执行，我在加载下一页的过程中得到了弹出窗口。

Answer 1

试试下面的。总之，它阻止了提交按钮的单击事件的默认提交操作，然后我们获取对表单元素的引用，如果 ajax 调用和确认的结果为 true，则提交此表单。

    $('#done').click(function(event) {

        //prevent submit
        event.preventDefault();

        //get form reference
        var frm = this.form;

        $.post(asyncController + "/checkItems", function(response) {

            if (response != "true") {

                var test = confirm('Are you sure?');

                if (test) {
                    //submit the form
                    frm.submit();
                } 

            }
        });
});