1

如果我有两个处理程序附加到同一个事件，有没有办法确保其中一个总是在另一个之前完成。

仅对于此示例，我使用超时来模拟长时间操作。但我可以有这样的东西：

var change_label = function () {

    var option = $(".selected_option a").text();
    $("li:first span").text(option);

};    


$("#container").on("click", "li", function () {
    var self = $(this);
    var t = setTimeout(function () {
        $(".sel").children("li").removeClass("selected_option");

        self.addClass("selected_option");

    }, 1000);

});



$("#container").on("click", "li", function () {

    change_label();

});

并确保在第一个应用类之前不会更改文本（由第二个处理程序）？

http://jsbin.com/ayihiv/1/edit

4

1 回答 1

1

这是一种您可能会觉得有趣的方法。

jQuery 的回调实用程序允许您做一些“松散耦合”。换句话说，您可以让 setTimeout 函数刺激一个动作或一组动作，而无需知道这些动作是什么；它们可以在代码的其他地方指定，唯一的要求是同一个Callbacks队列在两个代码块的范围内。

这实际上是一种“发布/订阅”模式，尽管我们在这里使用它来做一些除了发布和订阅之外的事情。

var cb = $.Callbacks('unique');

$("#container").on("click", "li", function() {
    var self = $(this);
    var t = setTimeout(function() {
        $(".sel").children("li").removeClass("selected_option");
        self.addClass("selected_option");
        cb.fire(self.find("a").text());//<<<<<< stimulate any functions currently in the callbacks list cb, and pass the required text to them.
    }, 1000);
});

var change_label = function(txt) {
    $("li:first span").text(txt);
};
var log_it = function(txt) {
    console.log('Text changed to: ' + txt);
};
var alert_it = function(txt) {
    alert('Text changed to: ' + txt);
};

cb.add(change_label);
//cb.add(log_it);
//cb.add(alert_it);

演示。尝试取消对最后两行的注释，您会看到当 1 秒延迟结束时会发生其他事情。

于 2013-06-26T02:16:23.083 回答