歌曲自動後從暫停切換到播放按鈕

我的自定義html mp3播放器出現了一個小問題。播放器完成歌曲後，暫停按鈕仍然存在，但應該有播放按鈕，以便您可以通過單擊播放該歌曲。歌曲自動後從暫停切換到播放按鈕

這裏是我的代碼：

<!doctype html> 
<html> 

<head> 

<script type="text/javascript"> 
      function play() 
      { 
       document.getElementById("player").play(); 
       document.getElementById("pausebutton").style.display = ""; 
       document.getElementById("playbutton").style.display = "none"; 




      } 

      function pause() 
      { 
       document.getElementById("player").pause(); 
       document.getElementById("playbutton").style.display = ""; 
       document.getElementById("pausebutton").style.display = "none"; 
      } 


</script> 

</head> 

<body onload="play()"> 

<audio id="player"> 
      <source src="test.mp3" type="audio/mpeg"></source> 

     </audio> 
     <img src="play.png" onclick="play()" id="playbutton" style="display: none"/> 
     <img src="pause.png" onclick="pause()" id="pausebutton" /> 

</body> 
</html>

在此先感謝

來源

2014-09-05 oldbloke

查找到「結束」事件上的音頻標籤/元素。這裏有一些[示例]（http://forestmist.org/blog/html5-audio-loops/） – 2014-09-05 18:03:08

@ i-- document.getElementById（「player」）。addEventListener（'ended'，function pause（）; can我這樣做？ – oldbloke 2014-09-05 18:35:15

是的，只要你的目標是IE9或更高版本，否則，你可以'document.getElementById（「player」）。onended = function ...' – 2014-09-05 20:08:55

你可以試試你的腳本標籤中添加以下內容：

window.onload = function() { 
    var player = document.getElementById("player"); 
    if (player) { 
     player.onended = function() { 
      pause(); 
      player.currentTime = 0; 
     }; 
    } 
};

來源

2014-09-05 20:54:34

mh，那不工作，聲音不能播放編輯：我錯了。聲音正在工作 – oldbloke 2014-09-05 20:58:37

沒有按鈕仍然沒有重置 – oldbloke 2014-09-05 21:02:36

你可以嘗試添加'player.currentTime = 0;'低於或高於'pause（）;'line。 – 2014-09-05 21:02:46

歌曲自動後從暫停切換到播放按鈕

回答

相關問題