音乐播放器播放列表逻辑

Question

我正在创建一个小型音乐播放器网络应用程序，一切正常，但我遇到了一个问题：

我也想为它创建一个播放列表，我是 JS 的初学者，我不知道如何为此创建逻辑（每次用户点击播放列表中的特定歌曲标题时，播放那个确切的他刚刚点击的歌曲）我将歌曲存储在一个数组中

源代码： https://yun.ir/qnrk56

Answer 1

您可以通过不同方式实现此行为。

这是我试过的： https://jsfiddle.net/2qc0kwbg/

我添加了一个名为 setSong() 的函数，它接受一个名为 number 的参数并将歌曲设置为该编号（从 prevSong() 和 nextSong() 复制的代码逻辑）。我向类 .player__song 的每个 HTML 元素添加了 onclick 属性，其值为 setSong(<index>)，其中 是数组中歌曲的索引。

setSong() 函数如下所示：

function setSong(number){
  currentSong = number
  showSong()
  audio.play()
  changeBgBody()
}