14

Check out my jsfiddle demo, if e.which == 1 then when you left click the h2 it will e.which == 2 or e.which == 3 then it wont work. 2 is the middle mouse button, and 3 is the right mouse button. i found this too:

JQuery provides an e.which attribute, returning 1, 2, 3 for left, middle, and right click respectively. So you could also use if (e.which == 3) { alert("right click"); }

This code isn't working:

code:

    $("h2").live('click', function(e) { 
   if( e.which == 2 ) {
      e.preventDefault();
      alert("middle button"); 
   }
});
android.nick
  • 11,069
  • 23
  • 77
  • 112

3 Answers3

24

You may want to trap the mousedown event, and you also need to prevent the oncontextmenu event to stop the context menu from coming up during the right click event.

$("h2").live('mousedown', function(e) { 
   if( (e.which == 1) ) {
     alert("left button");
   }if( (e.which == 3) ) {
     alert("right button");
   }else if( (e.which == 2) ) {
      alert("middle button"); 
   }
   e.preventDefault();
}).live('contextmenu', function(e){
   e.preventDefault();
});

UPDATE: .live() has been deprecated since jQuery 1.9. Use .on() instead.

$("h2").on('mousedown', function(e) { 
  if (e.which == 1) {
    alert("left button");
  } else if (e.which == 3) {
    alert("right button");
  } else if (e.which == 2) {
    alert("middle button");
  }
  e.preventDefault();
});
Advait Junnarkar
  • 3,283
  • 4
  • 13
  • 25
burntblark
  • 1,680
  • 1
  • 15
  • 25
  • Yeah, I found that `contextmenu` was a nice way to override the built-in menu. But maybe your first function could include it instead of tacking it on the end. I'm not sure why he's using live, but I would use `.bind('mousedown contextmenu', function...` – Mottie Oct 24 '10 at 12:24
  • lol! @fudgey I also tot why he was using live when he can use window.ready and just attach it straight. but i tot he must have his reasons. But about the tacking, it wud make whatever code he puts in the if statement execute twice. – burntblark Oct 24 '10 at 13:48
  • actually it's just a snippet of code i copied, so i have no clue why i'm using .live... haha, okay, so i'll work with what i have above, but did you think there was something better? and i'll use `.bind('mousedown contextmenu', function` – android.nick Oct 24 '10 at 14:43
  • 1
    if you use .bind('mousedown contextmenu', function, the code would be executed twice. if you can live with that then no problem. you are good to go – burntblark Oct 24 '10 at 15:35
2

I've noticed some oddities in the past with using the click event for anything but a regular left-click. I don't recall the details, but if you change "click" to "mousedown" or "mouseup" you should have better results.

Rebecca Chernoff
  • 22,065
  • 5
  • 42
  • 46
1

Now button has been fouled up beyond all recognition. According to W3C its values should be:

  • Left button – 0
  • Middle button – 1
  • Right button – 2

According to Microsoft its values should be:

  • Left button – 1
  • Middle button – 4
  • Right button – 2

No doubt the Microsoft model is better than W3C’s. 0 should mean “no button pressed”, anything else is illogical.

From http://www.quirksmode.org/js/events_properties.html

Pang
  • 9,564
  • 146
  • 81
  • 122
Pavel Blagodov
  • 572
  • 5
  • 6
  • [jQuery normalizes the following properties for cross-browser consistency: … `which`](http://api.jquery.com/category/events/event-object/). Better use `which` instead of `button`. – Pang May 09 '16 at 10:20