I've noticed a strange behaviour of the live()
function in jQuery:
<a href="#" id="normal">normal</a>
<a href="#" id="live">live</a>
$('#normal').click(clickHandler);
$('#live').live('click', clickHandler);
function clickHandler() {
alert("Clicked");
return false;
}
That's fine and dandy until you right-click on the "live" link and it fires the handler, and then doesn't show the context menu. The event handler doesn't fire at all (as expected) on the "normal" link.
I've been able to work around it by changing the handler to this:
function clickHandler(e) {
if (e.button != 0) return true;
// normal handler code here
return false;
}
But that's really annoying to have to add that to all the event handlers. Is there any better way to have the event handlers only fire like regular click handlers?
Using the mousedown() method: The mousedown() method in jQuery can be used to bind an event handler to the default 'mousedown' JavaScript event. This can be used to trigger an event. The event object's 'which' property can then used to check the respective mouse button.
jQuery | live() Method This method is used to attach one or more event handlers for the selected elements. It also specifies the function that runs when the event occurs. The event handlers used will work for both current and future elements matching the selector.
an Event will fire multiple time when it is registered multiple times (even if to the same handler).
Set the window.contextmenu property to an event handler function to listen for right clicks on the page. We have the e parameter that has the right-click event object. We call e. preventDefault to stop the default behavior for right clicks, which is to show the context menu on the page.
It's a known issue:
It seems like Firefox does not fire a click event for the element on a right-click, although it fires a mousedown and mouseup. However, it does fire a click event on
document
! Since.live
catches events at the document level, it sees the click event for the element even though the element itself does not. If you use an event like mouseup, both thep
element and thedocument
will see the event.
Your workaround is the best you can do for now. It appears to only affect Firefox (I believe it's actually a bug in Firefox, not jQuery per se).
See also this question asked yesterday.
I've found a solution - "fix" the the live()
code itself.
In the unminified source of jQuery 1.3.2 around line 2989 there is a function called liveHandler()
. Modify the code to add one line:
2989: function liveHandler(event) {
2990: if (event.type == 'click' && event.button != 0) return true;
This will stop the click events from firing on anything but the left-mouse button. If you particularly wanted, you could quite easy modify the code to allow for "rightclick" events too, but this works for me so it's staying at that.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With