时间戳

首页 > 解决方案 > 为什么我的停止按钮在这个 javascript 音频播放器上不起作用？

javascript - 为什么我的停止按钮在这个 javascript 音频播放器上不起作用？

问题描述

好的，大家好。我这里有一个简单的音频播放器，其中播放按钮和暂停按钮起作用，但停止按钮不起作用。由于暂停按钮有效，我可以以某种方式重复暂停功能但将歌曲设置为在 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>

标签： javascriptaudiohtml5-audioaudio-streaming

解决方案

在您的停止功能中，尝试暂停并设置当前时间：

function stop() {
  const audio = document.getElementById('audio');
  audio.pause();
  audio.currentTime = 0;
}

另请参阅： https ://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/currentTime

推荐阅读