[英]Javascript-Playing and pausing different audio files using different images
嗨,我正在尝试允许多个图像播放和暂停不同的歌曲,直到现在,当选择了图像时,我已经实现了歌曲的播放,但是当我暂停并尝试通过单击另一张图像继续播放时,恢复了先前的文件,而不是所需的文件下面是代码
Java脚本
function StartOrStop(audioFile)
{
var audie = document.getElementById("myAudio");
if(!audie.src || audie.src !== audioFile)
audie.src = audioFile;
if(audie.paused == false)
{
audie.pause();
}
else
{
audie.play();
}
}
的HTML
<img src="images/play.png" alt="Play Button" width="57" height="50" onclick="StartOrStop('RWY.mp3')">
<img src="images/play.png" alt="Play Button" width="57" height="50" onclick="StartOrStop('EL.mp3')">
<audio controls id="myAudio" ></audio>
关于如何解决此问题的任何建议?
嗨,不知道为什么这行不通。 我已经稍微修改了您的代码,所以尝试一下
function StartOrStop(audioFile)
{
var audie = document.getElementById("myAudio");
//logs to see filenames
console.log("audio src " ,audie.src); //this will output a full url e.g with www.example.com/file.mp3
console.log("file ", audioFile); // this only outputs what you pass in e.g "file.mp3"
//with the www.example.com the if statement below will be false as www.example.com/file.mp3 is not equal to file.mp3. Either change the onclick event of the images to include the full path or edit the if statement to
// if(audie.src.indexOf(audioFile) != -1){
if( audie.src == audioFile){
audie.paused ? audie.play() : audie.pause();
}else{
audie.src = audioFile;
audie.play();
}
}
我已经在我的机器上本地运行了它,并且可以按照您想要的方式运行
试试这个,现在运行
希望对您有帮助...
JAVASCRIPT代码
function Start(audioFile)
{
var audie = document.getElementById("myAudio");
console.log("audio src " ,audie.src);
console.log("file ", audioFile);
if( audie.src == audioFile){
audie.paused ? audie.play() : audie.pause();
}else{
audie.src = audioFile;
audie.play();
}
}
function Stop(audioFile)
{
var audie = document.getElementById("myAudio");
console.log("audio src " ,audie.src);
console.log("file ", audioFile);
if( audie.src == audioFile){
audie.paused ? audie.play() : audie.pause();
}else{
audie.src = audioFile;
audie.Pause();
}
}
================================================== =====
HTML代码
<img src="images/play.png" alt="Play Button" width="57" height="50" onclick="Start('RWY.mp3')">
<br>
<img src="images/stop.png" alt="StopButton" width="57" height="50" onclick="Stop('EL.mp3')">
<br>
<audio controls id="myAudio" ></audio><br>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.