Audiotag 时间控制 (#t=5,6) 第二次不工作

Question

从this answer开始，要在特定时间开始播放音频，我们可以在link之后使用#t=begintime,endtime。

这对我有用，但只有第一次 time.The 第二次，音频正在播放，但未在指定时间播放。

像这样：

 function drainwater(){
       document.getElementById("drain").play();
     }

<audio src="https://upload.wikimedia.org/wikipedia/commons/b/b9/Kitchen_sink_draining_water.ogg#t=5,6" id="drain"></audio>   
   


<button onclick='drainwater()'> Drain </button>

第二次，音频播放时间比我预期的要长。问题是什么？我该如何克服这个问题？

作为解决方法，我尝试使用计时器并在一定时间后暂停音频。

像这样：

function drainwater(){
       document.getElementById("drain").play();
     }
     
     
 function pause(){
       document.getElementById("drain").pause();
     }

<audio src="https://upload.wikimedia.org/wikipedia/commons/b/b9/Kitchen_sink_draining_water.ogg" id="drain"></audio>   
   


<button onclick='drainwater();setTimeout(pause, 2000)'> Drain </button>

（给可能正在使用此解决方案的人的建议：不要忘记从 link 中删除 #t=5,6 否则这将不起作用。）

这对于像下雨2分钟这样的同质音频来说可能已经足够了——前10秒和后10秒没有区别——所以我们可以用这种方法播放指定的时间.

但对于一般的音频，这是行不通的。第二次点击按钮，音频没有从指定位置开始播放。

那么为什么会这样？我们可以做些什么来在按钮点击时反复播放特定时间的音频？

Answer 1

看起来至少 Chrome 并且 Firefox 需要重新设置 URL 才能执行您想要的操作。如果您像这样更改 drainwater() 函数，它应该可以工作。

function drainwater(){
    const $drain = document.getElementById("drain");

    $drain.onpause = () => $drain.src = $drain.src;
    $drain.play();
}

我不确定这是错误还是预期的行为。

Audiotag 时间控制 (#t=5,6) 第二次不工作

Audiotag time control (#t=5,6) not working second time

javascript

html

html5-audio