Question

给出以下标记：

<audio controls onclick="alert('hi')">
    <source src="/url/track.mp3" type="audio/mpeg">  
</audio>

我没有得到onclick事件的回复。似乎所有onclick事件都绑定到播放器控件。

我的目标是在用户点击＆＃34;播放＆＃34;时运行单独的功能。

Answer 1

您正在寻找onplay属性。

<audio onplay="myFunction()">...</audio>

这里有一些关于它的article on w3schools

Answer 2

您可以在音频元素上放置一个不可见的div：

<script>
    function catchClick(){
        alert("hi");
    }
</script>

<div onclick="catchClick()" style="position:absolute;z-index:1;width:300px;height:30px;">
</div>
<audio controls>
    <source src="/url/track.mp3" type="audio/mpeg">
</audio>

然后，在catchClick函数中，您可以通过此方法How to simulate a mouse click using javascript

将鼠标单击传递给音频元素

<audio>元素上的onclick事件

2 个答案: