2012-08-15 32 views
0

解雇我有两个按钮:执行功能后,两个或多个事件在骨干

<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/

感谢

回答

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'); 
}); 
2

下面是使用承诺一个想法: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. 
});​