Handle multiple events in jQuery

Question

Can I turn this:

$(document).bind("mousedown", function(){
    n = 1;
});  

$(document).bind("mouseup", function(){
    n = 2;
});  

$(document).bind("mousemove", function(){
    n = 3;
});

Into something like this:

$(document).bind("mousemove mouseup mousedown", function(e){
    if (e.event == mousemove){
        n = 3;
    }
});

~~Adding more text because stackoverflow says my post contains mostly code~~

See this post: http://stackoverflow.com/questions/2534089/jquery-multiple-events-to-trigger-the-same-function (nearly the same problem) — Enthusiasmus, Sep 04 '13 at 23:41
One slight suggestion is to use a lookup to avoid an if - `n = ({mousedown: 1, mouseup: 2, ..})[e.type];` Or, another option is to just keep the non-numeric names as strings (which I find more clear than numbers :>) .. — user2246674, Sep 04 '13 at 23:43
@user2246674 i don't think he actually meant n=1,2,3 probably a pseudo code OP posted. — PSL, Sep 04 '13 at 23:44

score 1 · Accepted Answer · answered Sep 04 '13 at 23:40

1

You can use event.type in your case e.type to determine what event it is.

$(document).bind("mousemove mouseup mousedown", function(e){
    if (e.type== "mousemove"){
        n = 3;
    }...
});

In your case e is already an event so there is no property called event on e

answered Sep 04 '13 at 23:40

PSL

123,204
21
253
243

e.type instead of e.event ;) – Enthusiasmus Sep 04 '13 at 23:42

Alberto E. · Answer 2 · 2013-09-04T23:52:09.240

Well instead of trying to do this, with if statements to check the event:

$(document).bind("mousemove mouseup mousedown", function(e){
    if (e.type == mousemove){
        n = 3;
    } else if {
        //some code
    } ...   
});

You could simply:

$( document ).bind({
       mousemove: function() {
       n = 3;
    },
       mouseup: function() {
       // Do something on mouseup
    },
       mousedown: function() {
       // Do something on mousedown
    }

});

Code is much cleaner and it should perform faster.

As shown on the JQuery API Documentation. http://api.jquery.com/bind/#multiple-events

Handle multiple events in jQuery

2 Answers2