Ad

Why Blur And Focus Doesn't Work On Safari?

- 1 answer

I have simple button like that:

<button class="emoji-button-container" onblur="APP.hideEmojiContainer()" onclick="APP.toggleEmojiContainer()">

On Chrome both event works perfectly.

On Safari onclick event works without any problem, but onblur event doesn't get triggered. Also element.blur() function doesn't trigger onblur event. I need it to work on Safari just like on Chrome, so what can I do? what's problem here?

Ad

Answer

It seems Safari doesn't focus button element on click. So, according to definition, onblur attribute fires the moment that the element loses focus. Element is not focused => onblur doesn't fire.

One of the solution could be manually apply button.focus() after click.

Another one is to attach click event on document as here

Ad
source: stackoverflow.com
Ad