Javascript 音频不会停止并同时播放多个音轨
Posted
技术标签:
【中文标题】Javascript 音频不会停止并同时播放多个音轨【英文标题】：Javascript audio does not stop and play multiple tracks simultaniously 【发布时间】：2020-12-08 12:59:21 【问题描述】：javascript 音频不会停止并同时播放多个曲目。
我正在尝试随机播放 MP3/WAV 曲目的数量，并且它工作得很好，直到它假设停止最后一首曲目，所以以前的曲目之间有一个实时合并，这显然听起来像一团糟。
我敢打赌，解决这个问题只是一个小小的调整，但是...... :)
无论如何，这是我的代码：
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<title> </title>
</head>
<body>
提前感谢您的帮助：D
var t=setInterval(function()myTimer(),3000);
var files=
[
'Hezi-Gangina#1.mp3',
'Hezi-Gangina#2.mp3',
'Hezi-Gangina#3.mp3',
'Hezi-Gangina#4.mp3'
];
function myTimer()
if(audio)
audio.pause();
audio.currentTime=0;
delete audio;
var i=Math.floor(Math.random()*files.length);
var url=files[i];
var audio=new Audio(url);
audio.play();
document.title=url.replace(/\.[^/.]+$/,'');
</script>
</body>
</html>
【问题讨论】：
【参考方案1】：问题是区间的回调函数myTimer()。
让我们看看：
if(audio)
audio.pause();
audio.currentTime=0;
delete audio;
在上面，您正在检查变量 audio 是否存在，但这种情况永远不会成立。为什么？它是在此检查之后定义的并且它是在回调函数的本地范围内定义的：
var audio=new Audio(url);
audio.play();
因此，每次调用 myTimer 时都会重新定义局部变量，并在此函数中“生存”。
要解决此问题，您需要将音频设为全局变量，并将 if 检查修改为：
if(audio != null)
这将确保它不会在第一次尝试停止音频。
这是你修改后的代码：
var audio=null;
var t=setInterval(function()myTimer(),3000);
var files=
[
'Hezi-Gangina#1.mp3',
'Hezi-Gangina#2.mp3',
'Hezi-Gangina#3.mp3',
'Hezi-Gangina#4.mp3'
];
function myTimer()
if(audio != null)
audio.pause();
audio.currentTime=0;
delete audio;
var i=Math.floor(Math.random()*files.length);
var url=files[i];
audio=new Audio(url);
audio.play();
【讨论】：
以上是关于Javascript 音频不会停止并同时播放多个音轨的主要内容，如果未能解决你的问题，请参考以下文章
JavaScript - PC 端通过纯 js 播放音频文件（播放提示音）