javascript - Firefox addeventlistner('mouseover',...) onうまくいかない

Question

次の JavaScript は、Chrome の要素では正常にトリガーalertされ<button>ますが、Firefox ではトリガーされません。Firefox では、alertトリガーされません。

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

elementhtml をに置き換えると、イベントは Firefox で<span>期待どおりにトリガーされます。alert

問題のある HTML:

動作しないhtml

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

作業中のhtml

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

Firefox では、イベントは子からボタンにバブリングしませんか?

もしそうなら、回避策はありますか - css のためにbutton置き換える以外に。span

Answer 1

代わりにこれをしてもらえますか？

html:

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

JavaScript:

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