为啥我的停止按钮在这个 javascript 音频播放器上不起作用?

Posted

技术标签:

【中文标题】为啥我的停止按钮在这个 javascript 音频播放器上不起作用?【英文标题】:Why is my stop button not working on this javascript audio player?为什么我的停止按钮在这个 javascript 音频播放器上不起作用? 【发布时间】:2018-11-21 14:25:26 【问题描述】:

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

【问题讨论】:

developer.mozilla.org/en-US/docs/Web/API/… 不存在stop() 函数,是的,您可以这样做 暂停和停止在这种情况下或多或少是相同的功能。而且由于 stop() 不是一个函数,你应该只使用 pause(); 【参考方案1】:

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

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

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

【讨论】:

以上是关于为啥我的停止按钮在这个 javascript 音频播放器上不起作用?的主要内容,如果未能解决你的问题,请参考以下文章

按钮单击音频启动和停止 JS

如何在按下按钮时播放音频并在我的手指离开同一个按钮时立即停止?

Javascript按钮多个音频源

用javascript控制html5中audio的音频总时长,为啥在IE中,通过window.onload获取不到,而点击按钮可以

按下后退按钮时音频停止播放

创建一个只有播放和暂停的 Javascript 音频播放列表