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

Question

我正在使用代码簿上的一些代码，该代码的样式为audio标记以使用图标。

原始代码只能与一个玩家一起工作，所以我已经更改为可以与同一页面上的多个玩家一起工作。这工作，它确实播放正确的WAV文件取决于你点击哪个图标。

我的问题是一旦播放某个特定的wav文件完成后，图标不会恢复到原来的play状态。

我创建了一个FIDDLE这里显示了我的意思。

这是我使用时回放结束的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的

任何人的任何一个任何想法如何我可以解决这个问题？

谢谢

Answer 1

看起来我修好了。

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

新FIDDLE显示它的工作。