1

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

这是我用来在 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()在我的代码中调用，我也期待其他行为。

出于某种原因，我调用代码，它并没有覆盖“绑定”。

例如，如果我运行以下代码，则 的行为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
    });
4

2 回答 2

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({ ... });
于 2012-09-12T14:39:42.520 回答
0

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

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

尝试绑定/解除绑定$(document)（不带's）

于 2012-09-12T12:58:48.710 回答