HTML5播放器播放下一首代碼
在HTML5播放器中,我們可以使用JavaScript來實現播放下一首歌曲的功能。下面是一個簡單的示例:
// 獲取播放器元素 var audio = document.getElementById('myAudio'); // 定義歌曲列表數組 var songs = ['song1.mp3', 'song2.mp3', 'song3.mp3', 'song4.mp3']; // 定義當前歌曲索引 var currentSongIndex = 0; // 播放下一首歌曲 function playNextSong() { currentSongIndex++; if (currentSongIndex === songs.length) { currentSongIndex = 0; } audio.src = songs[currentSongIndex]; audio.play(); } // 監聽播放器的ended事件,當一首歌曲播放完畢時調用playNextSong函數 audio.addEventListener('ended', playNextSong);
在這個實例中,我們首先獲取了播放器元素,并定義了一個歌曲列表數組。然后定義了一個playNextSong函數,用于切換到下一首歌曲并播放。在函數中,我們首先將當前歌曲索引加1,然后判斷是否到達了歌曲列表的末尾,如果是,則將當前歌曲索引重置為0。接著,我們將播放器的src屬性設置為當前歌曲的URL,并調用play方法開始播放。最后,我們通過調用addEventListener方法,將播放器的ended事件與playNextSong函數綁定起來,即當一首歌曲播放完畢時自動播放下一首歌曲。
上一篇svg字體css3s節點
下一篇svg在線轉css