为什么我的停止按钮在这个 javascript 音频播放器上不起作用?
Why is my stop button not working on this javascript audio player?
好的,大家好。我这里有一个简单的音频播放器,其中播放按钮和暂停按钮有效,但停止按钮无效。由于暂停按钮有效,我能否以某种方式重复暂停功能,但将歌曲设置为在 0.00 时间再次开始并将其用作我的停止按钮?
<!DOCTYPE HTML>
<html>
<head>
<title>Audio</title>
</head>
<body>
<script>
function play(){
var audio = document.getElementById("audio");
audio.play();
}
function stop(){
var audio = document.getElementById("audio");
audio.stop();
}
function pause(){
var audio = document.getElementById("audio");
audio.pause();
}
</script>
<input type="button" value="PLAY" onclick="play()">
<input type="button" value="STOP" onclick="stop()">
<input type="button" value="PAUSE" onclick="pause()">
<audio id="audio" src="i_am.mp3" ></audio>
<audio id="audio" src="311.mp3" ></audio>
<audio id="audio" src="thievery_corporation.mp3" ></audio>
<audio id="audio" src="saxy.mp3" ></audio>
<audio id="audio" src="silent_rider.mp3" ></audio>
</body>
</html>
在您的停止功能中,尝试暂停并设置当前时间:
function stop() {
const audio = document.getElementById('audio');
audio.pause();
audio.currentTime = 0;
}
另请参阅:https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/currentTime
好的,大家好。我这里有一个简单的音频播放器,其中播放按钮和暂停按钮有效,但停止按钮无效。由于暂停按钮有效,我能否以某种方式重复暂停功能,但将歌曲设置为在 0.00 时间再次开始并将其用作我的停止按钮?
<!DOCTYPE HTML>
<html>
<head>
<title>Audio</title>
</head>
<body>
<script>
function play(){
var audio = document.getElementById("audio");
audio.play();
}
function stop(){
var audio = document.getElementById("audio");
audio.stop();
}
function pause(){
var audio = document.getElementById("audio");
audio.pause();
}
</script>
<input type="button" value="PLAY" onclick="play()">
<input type="button" value="STOP" onclick="stop()">
<input type="button" value="PAUSE" onclick="pause()">
<audio id="audio" src="i_am.mp3" ></audio>
<audio id="audio" src="311.mp3" ></audio>
<audio id="audio" src="thievery_corporation.mp3" ></audio>
<audio id="audio" src="saxy.mp3" ></audio>
<audio id="audio" src="silent_rider.mp3" ></audio>
</body>
</html>
在您的停止功能中,尝试暂停并设置当前时间:
function stop() {
const audio = document.getElementById('audio');
audio.pause();
audio.currentTime = 0;
}
另请参阅:https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/currentTime