播放结束时更改音频播放器图标

Question

我正在使用我在代码笔上找到的一些代码，这些代码将audio标签样式设置为使用图标。

原始代码仅适用于一个玩家，所以我已更改为适用于同一页面上的多个玩家。这有效，并且它会根据您单击的图标播放正确的 wav 文件。

我的问题是，一旦特定 wav 文件的播放完成，图标就不会返回到其原始play状态。

我

在这里创建了一个小提琴，它显示了我的意思。

这是我在播放后端时使用的jquery：

   $('#player' + id).on('ended', function() {
       console.log ('ended')
     $('#speaker' + id).removeClass('speakerplay');
     /*When the audio has finished playing, remove the class speakerplay*/
     audiostatus = 'off';
     /*Set the status back to off*/
   });

我认为问题是由于不知道 ID 或可能是任何一个玩家 ID

有人知道我该如何解决这个问题吗？

谢谢

Answer 1

看起来我已经修复了它。

 $('[id^="player"]').on('ended', function() {
     id = this.id.replace('player','')
     $('#speaker' + id).removeClass('speakerplay');
     audiostatus = 'off';
 });

新的小提琴显示它正在工作。