防止jQuery对话框提交两次

Question

我想阻止用户两次提交对话框。

这是我的提交代码：

$('form', dialog).submit(function () {
    if (dialogSubmitted) { return false; }
    dialogSubmitted = true;
    ...
    ...
});

其中dialogSubmitted是一个变量，指示表单是否已提交。问题是它不起作用。当我打开对话框并按两次（快速）时，表单会被提交两次。

有什么想法吗？

感谢。

---

更新

这是另一次尝试，当我快速按两次输入键时也失败了：

    $('form', dialog).one('submit', function (evt) {

        evt.preventDefault();

        $(this).on('submit', function (evt) {
            evt.preventDefault();
        });

        $.post($(this).attr('action'), $(this).serialize(), function (data, status) {
            $('#my-modal').modal('hide');
            ...
            ...
        }).error(function (error, status, a, b) {
            $('.modal-body p.body').html(error.responseText);
            writeError('msgError', pStopIndex.validationFailed);
        });

        // Unbind form submitting
        $('form', dialog).unbind();
        return false;
    });

正如你所看到的，我做了ajax帖子（代替经典表单提交）。也许问题存在？

以下是Google Chrome中的痕迹捕获：

我们可以看到有2个帖子。只有当我快速按两次输入键或快速点击提交按钮两次时才会出现。

有什么想法吗？感谢。

Answer 1

只需使用one()方法

参见示例小提琴：http://jsfiddle.net/MpBCL/

$('form', dialog).one('submit', function (evt) {

    /* prevent default action */
    evt.preventDefault();

    ...
    /* code to be executed once */
    ...

    /**
     * disable default action (this handler will be attached after first 
     * submit event and it will prevent any further submit action
     */
    $(this).on('submit', function (evt) {
       evt.preventDefault();
    });

});

进一步参考：http://api.jquery.com/one/

  

说明： 将处理程序附加到元素的事件。处理程序每​​个元素最多执行一次。