Question

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

就本例而言，我正在使用超时来模拟长时间的操作。但我可以这样：

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

Answer 1

这是一种你可能感兴趣的方法。

jQuery的Callbacks实用程序允许你做一些“松散耦合”。换句话说，您可以让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);

<强> DEMO 即可。尝试取消注释最后两行，你会发现当1秒延迟结束时会发生其他事情。

确保两个处理程序按特定顺序完成

1 个答案: