内部 JQuery 文档。准备覆盖外部文档答案

【问题标题】：Internal JQuery document.ready to override an external one内部 JQuery 文档。准备覆盖外部文档
【发布时间】：2012-02-14 19:51:13
【问题描述】：

我有一个带有$('form').submit() 操作的通用外部文件document.ready()，但是，我想从我的一个文件中覆盖此操作，其中包括document.ready()。

换句话说，我希望我的内部document.ready() 应该在$('form').submit() 工作之前对表单进行额外检查。

【问题讨论】：

好的。但是为什么你需要不止一个 document.ready()。 PROTIP 使用 $.fn.ready() 它的酷孩子

标签： jquery overriding external internal document-ready

【解决方案1】：

在您的内部代码中，您可以尝试停止submit 事件的立即传播：

$(function () {
    $('form').on('submit.immediate', function (event) {
        event.stopImmediatePropagation();
    });
});

然后，当您希望表单能够再次提交时，您只需删除此绑定：

$('form').off('submit.immediate');

这只会删除附加到 immediate 命名空间的 submit 事件处理程序，因此其他绑定将保持不变。

完全有可能我不太了解您的问题。您可能只需要将事件处理程序绑定到阻止其发送能力的表单，直到您决定发送它们：

$(function () {
    $('form').on('submit.immediate', function (event) {
        event.preventDefault();
    });
});

event.preventDefault() 将停止提交表单，然后您可以在要提交表单时删除此事件处理程序。

注意.on()/.off() 是 jQuery 1.7 中的新内容，在上面使用的情况下与.bind()/.unbind() 相同：http://api.jquery.com/on、http://api.jquery.com/off

event.stopImmediatePropagation() 的文档：

阻止其余的处理程序被执行并防止 DOM 树冒泡的事件。

来源：http://api.jquery.com/event.stopImmediatePropagation/

【讨论】：

我看到有多种方法可以完成这项任务。但它是一种灵活有效的方式来中断事件处理吗？如果你建立你的结构来防止这种事情，不是更好吗？您可以使用回调或发布和订阅来保持干净和可扩展
我真的不知道你在做什么。您需要发布代码以获得更多洞察力。像我在回答中所做的那样使用命名空间绑定事件是个好主意，这样您就可以根据需要删除特定的事件处理程序。如果您可以删除不想使用的事件处理程序，那么这确实是最好的方法，否则只需中断它的功能，只要您不一次对大量元素执行此操作，您就不会注意到任何性能下降。
很好的答案，谢谢。但我想知道您是否可以确保该事件在正确的时间被中断。据我所知，您将同时触发两个事件，即提交事件和中断事件。但我从未听说过submit.immediate 它是一个自我声明的命名空间，还是一个在正常.submit() 之前触发的jquery 指令？
这只是添加到事件处理程序的命名空间，因此您可以删除特定处理程序而不会影响其他处理程序。由于我不知道您的代码运行的顺序是什么，因此您看看是否可以中断submit 事件的最佳方法是尝试一下。
我不是这个问题的询问者。我只是请你解释一下你的方法。提问者使用.submit()，这是.trigger("submit") 的快捷方式，而不是.on("submit", callback)。我看到的问题是触发器可能在预防之前执行。

【解决方案2】：

我的做法是：

var formActions = new function() {

    this.form = $('form');

    this.doStuff = function() {

        //Do Stuff  

        //If you got more than one form
        $.each("this.form", function(i, v) {
            //PlayWithForm
        })

        this.submit();
    };

    this.submit = function () {

        this.form.trigger( "submit");
    }

}

$.fn.ready(function() {
    formActions.doStuff();
})

【讨论】：