Given the following HTML:
<div contenteditable="true">Some text</div>
And some JS which detects the click event with JQuery:
$("div").click(function() {
alert('click!');
});
If you select a portion of the text in the div, the click event will not be thrown by Opera (tested with Opera 11.61 on Linux and 11.62 on Windows). Double-clicking a word to partially mark it does work.
The event is thrown in IE7-9, Firefox, Chrome and Safari. There is a slightly modified JSFiddle here.
Is this expected behavior, a JQuery bug, an Opera bug, or something else?
which behaviour is 'correct' is certainly an interesting question. My take on it: I personally think Opera's behaviour makes more sense, as what the user intends to do here is clearly not to "click" something but to "select" something.
On the other hand, I also think Opera should change it to be compatible with the other browsers (unless we can get the other browsers to match Opera). Compatibility is very, very important. So, speaking with my Opera employee hat on: I think we're correct, and I think we should fix that :-p
Click events are known to have inconsistent behaviour between different elements and different browsers. At the heart of it, a click event is supposed to be fired when a single element records a mousedown followed by a mouseup, see jquery doc.
The best advice I have heard is from here:
Whether or not this is a problem depends on the user interaction you want. But you should generally register your script onmousedown/up, unless you’re completely sure you want the click event and nothing else.
So, in agreement with the comments to your question, the simplest solution is to register to mousedown or mouseup (which one depends on the behaviour you are looking for, the closest behaviour to 'click' would be 'mouseup')
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