我正在播放一个小音频剪辑点击每个链接在我的导航
HTML代码:
<audio tabindex="0" id="beep-one" controls preload="auto" >
<source src="audio/Output 1-2.mp3">
<source src="audio/Output 1-2.ogg">
</audio>
JS代码:
$('#links a').click(function(e) {
e.preventDefault();
var beepOne = $("#beep-one")[0];
beepOne.play();
});
到目前为止一切正常。
问题是当一个声音剪辑已经运行，我点击任何链接没有发生。
我试图停止点击链接时已经播放的声音，但在HTML5的音频API中没有直接事件
我试着遵循代码，但它不工作
$.each($('audio'), function () {
$(this).stop();
});
有什么建议吗?
当前回答
我在寻找一些类似的东西，因为制作一个应用程序，可以用来图层彼此的声音聚焦。我最终做的是-当选择一个声音时，用Javascript创建音频元素:
const audio = document.createElement('audio') as HTMLAudioElement;
audio.src = getSoundURL(clickedTrackId);
audio.id = `${clickedTrackId}-audio`;
console.log(audio.id);
audio.volume = 20/100;
audio.load();
audio.play();
然后，附加子文件实际上表面的音频元素
document.body.appendChild(audio);
最后，当取消选择音频时，您可以停止并完全删除音频元素-这也将停止流。
const audio = document.getElementById(`${clickedTrackId}-audio`) as HTMLAudioElement;
audio.pause();
audio.remove();
其他回答
从我自己的javascript函数切换播放/暂停-因为我正在处理一个广播流，我希望它清除缓冲区，以便侦听器最终不会与广播电台不同步。
function playStream() {
var player = document.getElementById('player');
(player.paused == true) ? toggle(0) : toggle(1);
}
function toggle(state) {
var player = document.getElementById('player');
var link = document.getElementById('radio-link');
var src = "http://192.81.248.91:8159/;";
switch(state) {
case 0:
player.src = src;
player.load();
player.play();
link.innerHTML = 'Pause';
player_state = 1;
break;
case 1:
player.pause();
player.currentTime = 0;
player.src = '';
link.innerHTML = 'Play';
player_state = 0;
break;
}
}
事实证明，只是清除currentTime并不能在Chrome下削减它，需要清除源代码，并将其加载回来。希望这能有所帮助。
这是我做stop()方法的方式:
代码中的某个地方:
audioCh1: document.createElement("audio");
然后在stop()中:
this.audioCh1.pause()
this.audioCh1.src = 'data:audio/wav;base64,UklGRiQAAABXQVZFZm10IBAAAAABAAEAVFYAAFRWAAABAAgAZGF0YQAAAAA=';
这样我们就不会产生额外的请求，旧的被取消，我们的音频元素处于清洁状态(在Chrome和FF测试):>
首先，你必须为音频元素设置一个id
在js中:
var ply = document.getElementById('player');
var oldSrc = cp .src;//只是为了记住旧的源代码
厚度。SRC = "";//要停止播放，你必须将源代码替换为空
而不是stop()，你可以尝试:
sound.pause();
sound.currentTime = 0;
这应该会有预期的效果。
如果你的网站上有几个音频播放器，你想暂停它们:
$('audio').each( function() {
$(this)[0].pause();
});
