js隨機切換背景音樂

logincat發表於2018-05-27

1.通過觸發onended事件呼叫函式改變音訊的src(地址)來達到切歌

 <audio autoplay="autoplay" src="cfc.mp3" id="song" onended="change()"></audio> 
                                                      #onended DOM事件物件
 <script type="text/javascript">
    var song = document.getElementById(`song`);
    music =new Array(`音樂存放的地址eg:media/xxx.mp3`,`xxxxxx`,`xxxx`);
    function change() {
        if(song.ended){#判斷音樂是否播放完
        index = Math.floor(Math.random()*music.length);
        #Math.floor()就近取整
        #Math.random() 0-1內的隨機數 Math.random()*10代表0-10內的隨機數
        song.src=music[index];
        song.play();
    }
 } 
</script>

2.通過設定監聽事件

  <script type="text/javascript">
  var song = document.getElementById(`song`);
  music =new Array(`media/cfc.mp3`,`media/fhm.mp3`);
  song.addEventListener("onended" ,function(){
    if(song.ended){
    index = Math.floor(Math.random()*music.length);
    song.src=music[index];
    song.play();
  }
  });
  </script>

  照搬以上程式碼是執行不了的,把他放到window.onload=function(){   } 去,才能執行

  element.addEventListener(event, function, useCapture)


相關文章