在Backbone中触发两个或多个事件后执行一个函数

时间:2012-08-15 15:48:51

标签: backbone.js backbone-events

我有两个按钮:

<button id="1">button 1</button>
<br>
<button id="2">button 2</button>

我想在点击两个按钮后发出警告信息,这是我使用Backbone.js的较大应用程序的一部分,到目前为止我有这个:

var test = {}; 

_.extend(test, Backbone.Events); //in order to use the backbone events feature

test.on("hello bye", function(){
    alert("works!");
});

$("#1").click(function() {
    test.trigger("hello");
});

$("#2").click(function() {
    test.trigger("bye");
}?);

只要点击其中一个按钮,就会显示该消息,但只有在单击两个按钮后才需要它才能。有没有办法使用Backbone.Events功能或者使用jQuery实现这一点?

小提琴:http://jsfiddle.net/ccgRN/

由于

2 个答案:

答案 0 :(得分:2)

以下是使用promises的想法:http://jsfiddle.net/LFJGL/1/

编辑:针对旧浏览器修复:

var test = {};
var promises = [];
_.extend(test, Backbone.Events); //in order to use the backbone events feature

function GetAPromise() {
    var p = $.Deferred();
    promises.push(p);
    return p;
}

var events = "hello bye".split(" ");
_.each(events,function(event) {
    var p = GetAPromise();
    test.on(event, function() {
        p.resolveWith(event);
    });
});

$("#1").click(function() {
    test.trigger("hello");
});

$("#2").click(function() {
    test.trigger("bye");
});


$.when.apply($, promises).done(function() {
    alert('triggered');
    //might be nice to remove the event triggers here.
});​

答案 1 :(得分:1)

最简单的实现方法是创建一些变量来跟踪已触发的事件。

var helloClicked = false;
var byeClicked = false;
var test = {};

_.extend(test, Backbone.Events);

test.on('hello bye'), function() {
  if (helloClicked && byeClicked) {
    alert('works!');
  }
});

$('#1').click(function() {
  helloClicked = true;
  test.trigger('hello');
});

$('#2').click(function() {
  byeClicked = true;
  test.trigger('bye');
});