javascript - 如何使用香草 javascript 自动播放下一首歌曲
问题描述
嗨,我正在尝试在当前播放歌曲结束时自动播放下一首歌曲。
我还想知道如何确保播放列表在最后一首歌结束时从头开始。
谢谢 !
var songs = [
"song1.mp3",
"song2.mp3",
"song3.mp3",
"song4.mp3"
];
var song = new Audio();
var currentSong = 0;
var len = currentSong.length - 1;
function playSong() {
song.src = songs[currentSong];
song.play();
}
// play the next song when current song ends
song.addEventListener("ended", function playNextS() {
currentSong++;
if (currentSong == len) {
currentSong = 0;
playSong();
}
<div class="player">
<div class="songCover"><img src="" alt="" /></div>
<div class="about">
<div class="songTitle"></div>
<div class="Artist"></div>
</div>
</div>
解决方案
试试这个,你没有以正确的方式使用数组
var songs = [
"song1.mp3",
"song2.mp3",
"song3.mp3",
"song4.mp3"
];
var song = new Audio();
var currentSong = 0;
var len = songs.length;
function playSong(index) {
song.src = songs[index];
song.play();
}
song.addEventListener("ended", function playNextS() {
currentSong++;
if (currentSong == len) {
currentSong = 0;
playSong(currentSong);
}
else{
playSong(currentSong);
}
<div class="player">
<div class="songCover"><img src="" alt="" /></div>
<div class="about">
<div class="songTitle"></div>
<div class="Artist"></div>
</div>
</div>
推荐阅读
- c - 如何并行计算 k 个集合位的所有组合?
- mysql - 如何在typeorm和nestjs中检索具有两个条件的数据
- function - 如何在 lua 表中调用未命名函数?[从桌子外面]
- python-3.x - 在 python3 Gtk 应用程序中监视文件的更改
- ssl - 使用练习 cli 时获取 tls 握手超时
- typescript - 如何将对象传递给打字稿中的函数?
- reactjs - 在前端显示指定列表
- android - Makefile 生成错误的符号链接
- primeng - PrimeNG p-multiSelect 自定义选定项目的标签
- exception - 如何通过 try catch 处理这个异常?AttributeError:“NoneType”对象没有属性“get_text”