Question

我正在使用HTML和JS / JQuery中的音频来构建音频播放器。我有播放，暂停和快进工作，但没有倒带或倒退。在W3Schools Documentation中它说：

playbackspeed 表示音频/视频的当前播放速度。示例值：

-1.0向后

所以我编写的代码如下：

<audio id="player">
    <source src="http://www.dkedomain.com/public/podcast/shows/the-domain-episode-09.mp3" type="audio/mpeg" />
</audio>

<button class="rewind">Rewind</button>
<button class="play">Play</button>
<button class="pause">Pause</button>
<button class="twotimes">2x</button>
<button class="forward">Fast Forward</button>

<script>

    var player = document.getElementById('player');;
    player.load();

    $('button.rewind').click(function(){
        player.playbackRate = -1.0;
    });

    $('button.play').click(function(){
        player.play();
        console.log(player.currentTime);
    });

    $('button.pause').click(function(){
        player.pause();
        console.log(player.currentTime);
    });

    $('button.twotimes').click(function(){
        player.playbackRate = 2.0;
    });

    $('button.forward').click(function(){
        player.playbackRate = 3.0;
    });

</script>

如何按照文档记录这项工作？

Answer 1

How can I play audio in reverse with web audio API?的此Stack Overflow答案显示设置audio.playbackrate = -1将起作用，基于WebKit的浏览器除外。 Chrome和Safari会忽略此设置，但其他浏览器可能会支持此设置。

一个有趣的事情可能是实现倒带几秒钟，有点像一些DVR播放器。这样的事情可能有用：

$('button.rewind').click(function() {
    var currentTime = player.currentTime;
    player.currentTime = (currentTime >= 3.0) ? currentTime - 3.0 : 0;
});

对于特征的对称性，您也可以对快进进行相同的操作。你的2x按钮很好，玩得更快＆＃34;解决方案，这是这种方法的一个很好的补充。

我为此创建了一个jsFiddle，您可能会想要进行各种其他更改：https://jsfiddle.net/mgaskill/11n63g3w/

HTML音频 - 否定播放值不起作用？

1 个答案: