7

Scenario: display alert message onblur (or onchange) as a part of javascript field validation.

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

Result: mousedown seems to be performed at the position where you clicked out before the alert came up -- elements on the page get selected when you move the mouse around.
Note: This doesn't happen when tabbing out of the 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>

Reproduced on:
Firefox 28 and 29 Platforms: Windows 7 & 8 and OSX Mavericks (4 different machines).
Using a clean Firefox profile made no difference.

QUESTION: Is this a bug, or default behavior? Chrome, Safari and IE don't behave like this.
If it's as designed, do I need to do something with preventDefault or cancel bubbling/stop propagation after the alert to stop this behavior?

2 Answers2

3

You can try to add:

window.getSelection().removeAllRanges();

This will solve your issue.

To answer your question: this seems to be a bug of FireFox and needs a workaround. What happens is FireFox messed up the priority of events where focus is set first, prior to onblur. Browsers who don't have the bug will not fire the focus event when onblur occurs.

DEMO

Tim Vermaelen
  • 6,869
  • 1
  • 25
  • 39
  • Thank you -- that should work for my applications. I wonder why Mozilla doesn't give higher priority to fixing basic things like this. – Benjamin Jung May 02 '14 at 20:01
  • 1
    I don't really see the link to the bug you linked to, but I submitted this as a new bug, which has been confirmed: https://bugzilla.mozilla.org/show_bug.cgi?id=1005606 It's backlogged unfortunately... – Benjamin Jung May 19 '14 at 16:47
  • 2
    It's a bit indirect since the bug talks about `focus` issues. Although it's the root cause for this particular issue (imho). After searching some more I found [similar issues](https://bugzilla.mozilla.org/show_bug.cgi?id=53579) dating way back to 2000 and they all require the same workarounds. It's a good thing they acknowledge it I guess. – Tim Vermaelen May 19 '14 at 17:48
  • 1
    Gosh, 14 years. That bug will probably never be fixed then, unless that particular part of Firefox ever gets an overhaul perhaps. – Benjamin Jung May 20 '14 at 18:13
2

That's interesting. This feels like a bug. I did get around it be calling setTimeout, and then calling alert:

<input ... onblur="setTimeout(function() { alert(...); }, 0);">
Greg Burghardt
  • 17,900
  • 9
  • 49
  • 92