Question

我正在为两个不同的事件绑定不同的加载消息。

以下是我在AJAX调用之前用于绑定行为的函数。我在每个匹配的Ajax提交之前调用每个函数，以便它为每个函数显示正确的加载消息：

function BindPersonalityLoader()
{

    // Bind the loader to personality
    $('document').bind("ajaxStart", function() {
        // Show the loader
        $('img#personality_loader').show();
    });

    // Bind the loader to personality
    $('document').bind("ajaxStop", function() {
        // Show the loader
        $('img#personality_loader').hide();
    });
}

function BindLoadEditPersonalityLoader()
{

    // Bind the loader for editing a personality
    $('document').bind("ajaxStart", function() {

        // Hide the edit form
        $('div#quiz_maker_add_personality_wrapper').hide();

        // Show the loader
        $('div#quiz_maker_edit_personality_loader').show();
    });

    // Bind the loader for editing a personality
    $('document').bind("ajaxStop", function() {

        // Hide the loader
        $('div#quiz_maker_edit_personality_loader').hide();
    });
}

一旦我调用了BindLoadEditPersonalityLoader()，由于某些原因，这就变成了永久性的，即使我在我的代码中调用BindPersonalityLoader()，我也期待其他行为。

由于某些原因我调用代码，它不会覆盖“bind”。

例如，如果我运行以下代码，BindLoadEditPersonalityLoader()的行为始终存在，因为它首先被调用：

// Bind the loaders once
BindLoadEditPersonalityLoader();

// Bind the loaders to different behaviour
BindPersonalityLoader();

我已经包含了两条alert()消息，以便我可以看到它们何时被调用。

我试过调用unbind("ajaxStart ajaxStop");，但这也不起作用。

这就是我在两个不同的事件中调用绑定的方式：

    // Add a new personality to the quiz
$('form#personality_editor').submit(function(e) {

    e.preventDefault();

    // Bind the loader to personality loader
    BindPersonalityLoader();

            // AJAX Call here

    });

    // Edit a personality already existing within the quiz
$('a.personality_edit').live('click', function(e) {

    e.preventDefault();

    // Bind loader for editing personality
    BindLoadEditPersonalityLoader();

            // Ajax call here
    });

Answer 1

ajaxStop和ajaxStart是全局事件，当没有其他待处理的ajax请求时，每当ajax请求结束时，每当ajax请求结束时，就会在所有元素上触发事件没有其他待处理的ajax请求。

我认为没有理由拥有多个装载盒。您是否考虑过只有一个装载盒，但有办法简单地更改其中显示的内容？

$("#loader").ajaxStart(function(){
    $(this).show();
}).ajaxStop(function(){
    $(this).fadeOut();
});
// ... later on ...
$("#loader span.infotext").text("Loading User Profile, please wait...");
$.ajax({ ... });

Answer 2

绑定未被“覆盖”，因为您将事件绑定到不同的对象。

$('img#personality_loader').bind("ajaxStart", function() {...});
$('div#quiz_maker_edit_personality_loader').bind("ajaxStart", function() {...});

尝试在$(document)（没有's）

上绑定/解除绑定

jQuery ajaxStart和ajaxStop无法重新绑定

2 个答案: