CODEWITHSUNDEEP
javascriptfirefoxaddeventlistenerevent-listener
Rich Tier
Rich Tier

Reputation: 9441

Firefox addeventlistner('mouseover',...) on <button> not work

The following javascript successfully trigger alert on <button> element for Chrome but not Firefox; with Firefox, alert is not triggered:

element.addEventListener('mouseover', function(){ alert('mouseover') }, false);

When I replace element html to <span>, the event triggers the expected alert in Firefox, as expected.

Offending html:

not working html

<button id="button-upload"><span>upload</span></button>

working html

<span id="button-upload"><span>upload</span></span>

In firefox, do events not bubble to buttons from children?

If so, is there a workaround - other than replacing button with span due to css.

Upvotes: 3

Views: 429

Answers (1)

Joon
Joon

Reputation: 9884

Could you do this instead?

html:

<div><button id="button-upload"><span>upload</span></button></div>

javascript:

document.getElementById('button-upload').parentNode.addEventListener('mouseover', function(){ alert('mouseover') }, false);

Upvotes: 1

Related Questions