<!doctype html>
<body>
<input onblur="alert('b');">
<button onmousedown="alert('m');">a</button>
</body>
For some reason blur seems to fire first on FF / IE (but mousedown seems to fire first for Chrome / Safari).
Yet when we change the code to this:
<!doctype html>
<body>
<input onblur="document.title+='b';">
<button onmousedown="document.title+='m';">a</button>
</body>
Now for some reason mousedown seems to fire first for all browsers.
1) What may be the explanation for this abnormality?
2) Based on W3C specs, which should be the standard behavior?
It looks like click event has lower priority than blur, so it is predictible behaviour that blur event fires first. This is has been something that has been an issue for me for awhile. Thanks for the answer.
The blur event fires when an element has lost focus. The main difference between this event and focusout is that focusout bubbles while blur does not.
If you want to prevent the blur event from being fired, you have to do so when you are inside the mousedown event, you can do so by invoking the method preventDefault() on the event. Click the checkbox, focus input & then click the button, the textfield never loses focus now.
Events focus/blur The focus event is called on focusing, and blur – when the element loses the focus. Let's use them for validation of an input field. In the example below: The blur handler checks if the field has an email entered, and if not – shows an error.
So for this test I made this fiddle
<input onblur="document.getElementById('msg').innerHTML+=new Date().getTime()+' - blur<br/>'">
<button onmousedown="document.getElementById('msg').innerHTML+=new Date().getTime()+' - md<br/>'">a</button>
<div id="msg">---<br/></div>
On Windows XPsp3, in Fx5, IE8, Opera 11, Safari5, Chrome 13 it is ALL mousedown first, blur after
UPDATE: EXCEPT when you use alert. You cannot count on anything working the way you want them to if you put an alert somewhere.
For example some (older) browsers would go into a never ending loop if you alerted an error onblur and then tried to focus the offending field, which would then blur the empty next field
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