Javascript - Blur Firefox behavior with the mouse. Error?

Scenario: displays an onblur (or onchange) warning as part of a javascript field check.

User action with onblur:
1) click inside the input
2) click outside input
3) close the warning message
4) move the mouse around

Result: mousedown seems to be executed in the place where you clicked before the warning - the elements selected on the page are selected when the mouse is moved.
Note. This does not happen if you exit input.

Demo: http://jsfiddle.net/s9sc4/

<body> Click inside the input and then outside of it. <input type="text" onblur="alert('Close this alert message and move the mouse around.');" /> TEST TEST TEST </body> 

Played:
Firefox 28 and 29 Platforms: Windows 7 and 8 and OSX Mavericks (4 different devices).
Using a clean Firefox profile didn't make any difference.

Question: Is this a bug or a default behavior? Chrome, Safari, and IE don't behave this way. If so designed, do I need to do something with preventDefault or cancel the swell / stop propagation after a warning to stop this behavior?

+6
source share
2 answers

You can try adding:

 window.getSelection().removeAllRanges(); 

This will solve your problem.

To answer your question: it looks like a FireFox error and requires a workaround. What happens, FireFox mixed up the priority of events where focus set first, before onblur . Browsers that do not have an error will not fire the focus event when onblur occurs.

Demo

+3
source

It is interesting. This seems like a mistake. I went around it by calling setTimeout and then calling alert :

 <input ... onblur="setTimeout(function() { alert(...); }, 0);"> 
+2
source

All Articles