javascript - 在 Chrome 中重播 Audio 元素

Question

sounds["foo"]= new Audio("foo.ogg");
function playSound(id){

var snd = this.sounds[id];

if(snd.currentTime>snd.duration*0.99999){
    snd.pause();
    snd.currentTime=0;
    //snd.seekable.start(); //doesnt work
    //snd.load(); does the trick but with the cost re-downloading the clip every single time
    snd.play();
}
if(snd.currentTime==0)
snd.play();
}

出于某种原因 playSound('foo');第一次可以工作，但之后在 Chrome 上就失败了(在 Firefox 上工作得很好)。添加 snd.load() 似乎可以解决此问题，但现在每次播放剪辑时它都会从服务器下载剪辑，这在我的用例中很多。

编辑:哦，snd.currentTime 似乎卡在最后，所以 snd.currentTime=0 什么也不做。

Answer 1

以下脚本在 OSX、Chrome 版本 32.0.1700.102 和 Firefox 27.0 上运行得很好。

如果您不想立即循环文件，那么您的脚本绝对是正确的方法。

我无法重现您的问题。我将该方法与链接上的 onclick 操作相关联，并使用 5s .ogg 文件进行测试。单击链接并重新播放音频文件一直对我有用。我注意到的唯一可能的问题是你的第二个 if 子句。如果第一个if匹配，则时间设置为0并且将播放文件。即使在我看来这不太可能，但第二个 if 也可能匹配并且 snd.play() 被第二次调用。因此我会使用 else if。

你能尝试一下吗？即使我认为它不能解决您的问题:/

<script type="text/javascript">
    var sounds = [];
    sounds["foo"]= new Audio("foo.ogg");

    /* First solution, creating a loop */
    function playSoundLoop(id){
        var snd = this.sounds[id];  
        snd.play();
        snd.addEventListener('ended', function(){
            this.currentTime = 0;
            this.play();
            }, false);
    }

    /* Use else if instead of if */
    function playSound(id){
        var snd = this.sounds[id];

        if(snd.currentTime>snd.duration*0.99999){
            snd.pause();
            snd.currentTime=0;
            snd.play();
        } else if(snd.currentTime==0) {
            snd.play();
        }
    }
</script>