多个音频播放器互相暂停

Question

希望你能帮我解决这个问题。我有一个包含多个音频播放器的页面，基于这个 jsbin：http://jsbin.com/wofava/edit?html,css,js,output

一切正常，除了按钮 play/pause all 的曲目，而不是暂停一个并播放另一个。

很明显，问题就在这里：

$pp.click(function() {
return AUDIO[AUDIO.paused?'play':'pause']();

现在，我可以为每个曲目分配单独的 ID，但由于会有十几个曲目，我认为必须有更简单的方法来做到这一点...

Answer 1

您可以通过以下方式访问相应 "playpause" div 受影响的 audio 元素：

$pp.click(function() {
    $audio = $('audio', $(this).parent())[0];
    $audio[$audio.paused?'play':'pause']();
});

基本上，您会查找 audio 元素，该元素位于 $(this).

的父元素的上下文中

$(this)指的是被点击的对象（"playpause"div）。它的父级是 div 容器 (<div class="player">)，它包装了 audio 元素和 "playpause"。

问题是您的 "progress" 函数也通过 class 选择元素，因此您需要以相同的方式调整它让它起作用。无论如何，要查看此解决方案，只需将标准控件添加到您的视频中即可：

<audio controls ...

你会看到其中一个 play/pause。

希望对您有所帮助！

Multiple audio players pause each other