2017-06-18 7 views
0

DOMにオーディオ要素があります。 私は、次のコマンドを実行し、クリックイベントが何らかの理由で発生しませんように思える:クリックイベントはクロムのオーディオ要素で発生しません

$0.addEventListener('click',function(){console.log('click')}); 

私は期待通りに働いていたマウスオーバーハンドラーを追加してみました:クリックFirefoxので

$0.addEventListener('mouseover',function(){console.log('mouseover')}); 

イベントは正常に動作します。 アイデア

答えて

0

直接的には動作しません。

clickイベントを取得するには、shimified divを追加する必要があります。

Javascriptを:

function onAudioElClick() { 
    console.log('click'); 
} 

HTML:

<div onclick="onAudioElClick()" style="position:absolute; z-index:9999; width:300px; height:30px;"></div> 
<audio></audio>` 
+0

I実際にはしたくないo htmlを変更する。これはクロムのバグだと言っていますか? –

+0

これは望ましい動作です。 – gauravmuk

+0

なぜですか?オーディオ要素がクリックイベントを引き起こさないことが文書化されていません。 –

0

mouseover作品が、clickないということは非常に奇妙です。

あなたは、あなたがclickイベントを処理することができますdivのような他の要素への内側audio要素をラップする場合:

はJavaScript:

<div> 
    audio element 
    <audio src="http://developer.mozilla.org/@api/deki/files/2926/=AudioTest_(1).ogg" autoplay></audio> 
</div> 

HTML:

var el = document.querySelector("div"); 
el.addEventListener('click',function(){console.log('click')}); 

https://jsfiddle.net/b3sbmqpj/

関連する問題