我正在开发一个网络应用程序,我需要在其中播放单词和句子的音频文件。我正在使用 backbone 从服务器获取和呈现内容。音频文件存在于 S3 上。呈现内容时,我播放单词音频文件,然后播放句子音频文件。我还有一个按钮,可以重播单词和句子的音频。
我的问题是 Firefox 在初始播放后不会重播音频文件。当 playWord
和 playSentence
被调用时,没有任何反应。 Safari 和 Chrome 中的代码字很好。
events: {
"click a#play-sentence": "playSentence",
"click a#play-word": "playWord"
},
// render markup when model has synced with server
render: function() {
this.$el.html(this.template({ exam: this.model }));
this.cacheMedia();
return this;
},
// save audio objects. play word then sentence
cacheMedia: function() {
this.audioWord = this.$el.find('#audioWord').get(0);
this.audioSentence = this.$el.find('#audioSentence').get(0);
this.audioWord.addEventListener('ended', function(){
this.currentTime = 0;
}, false);
this.audioSentence.addEventListener('ended', function(){
this.currentTime = 0;
}, false);
var view = this;
var playSentence = function() {
view.audioSentence.play();
view.audioWord.removeEventListener('ended', playSentence);
};
this.audioWord.addEventListener('ended', playSentence);
this.audioWord.play();
},
// play sentence audio
playSentence: function(e) {
e.preventDefault();
this.audioWord.pause();
this.audioWord.currentTime = 0;
this.audioSentence.play();
},
// play word audio
playWord: function(e) {
e.preventDefault();
this.audioSentence.pause();
this.audioSentence.currentTime = 0;
this.audioWord.play();
}
最佳答案
在这两种情况下,您需要做的就是调用 .load()
,即 playWord()
应该只需要 this.audioWord.load() ;
和 playSentence()
应该只需要 this.audioSentence.load()
;.
关于javascript - HTML5 音频不会在 Firefox 中播放第二次,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27829023/