如何制作一个函数，在按下暂停按钮后，在3秒钟后自动恢复音频

Question

我想创建一个简单的页面，该页面在Autoplay上具有音频。它还具有"暂停"one_answers"播放"按钮。我想创建一个函数，当您按"暂停"按钮时，音频将停止；但是3秒后，音频将恢复到当前的繁殖标记。

喜欢函数，当您按"暂停"按钮时，音频停止，但是在延迟延迟之后。3秒钟自动按下"播放"按钮。(这就是我认为它可以工作的方式，但我没有知识(

这是我的 html

<audio id="player" src="audio/song.mp3"  loop></audio>
<div>
<button class="play" onclick="document.getElementById('player').play()">Play</button>
<button class="pausa" onclick="document.getElementById('player').pause()">||</button></div>

Answer 1

我个人可能不同意在 n 秒后自动恢复暂停媒体的决定。但是为了纯粹的技术理解，我将分享我将如何做到。

构建在已经拥有的基础上，您可以在onclick上有多个命令。添加SettiMout((函数调用3000毫秒后播放(3秒(：

<button class="pausa" onclick="document.getElementById('player').pause(); setTimeout(document.getElementById('player').play(), 3000)">||</button>

当然，如果您将所有代码移动到功能，然后将该函数调用，那就更好了。这样，您就可以拥有更多代码，而无需使HTML/视图不可读和拥挤。这样：

编辑：我更正了一个错字：" pasenplay(("，而不是" pausenplay(("。现在它可以很好地工作！

<button class="pausa" onclick="pauseNplay()">||</button>

javaScript：

function pauseNplay(){
   var player = document.getElementById('player');
   player.pause(); 
   setTimeout(function(){ player.play() }, 3000);
}