分析代码:$("#sim_song_info").text(song.getSongName()+" - "+song.getSingerName()); //加载歌曲声音 song.loadSongSound(function () { var me = this; player._currentSong=this; audioEl.attr("src",this.getSongSound()); var audioPlay = audioEl[0].play(); audioPlay.then(function () { player.switchToBtnPlay(true); player._playhistory.push(me.getSongId()); songlistEl.find("tr").each(function () { var tr = $(this); var songId = parseInt(tr.attr("song_id")); if(player._currentSong.getSongId() === songId){ tr.addClass("songlist__item--playing"); } else { tr.removeClass("songlist__item--playing"); } }); }).catch(function () { alert("无自动播放权限"); }); });
时间: 2024-01-22 14:02:23 浏览: 93
这段代码的作用是,根据传入的歌曲对象 `song`,设置页面上的相应元素,加载歌曲声音,并更新页面上的播放按钮、播放历史和当前播放歌曲的样式。
首先,通过选择器 `$("#sim_song_info")` 获取到页面上 id 为 `sim_song_info` 的元素,并将歌曲名称和歌手名称设置为该元素的文本内容。
接着,调用 `loadSongSound()` 方法加载歌曲声音。在加载成功后,将获取到的歌曲声音路径设置为 `audioEl` 元素的 `src` 属性,并调用 `play()` 方法开始播放音乐。此时,返回一个 Promise 对象,可以通过 `.then()` 和 `.catch()` 方法来处理播放成功或失败的情况。
在播放成功的情况下,调用 `player.switchToBtnPlay(true)` 方法将播放按钮切换为“暂停”状态,并将当前播放歌曲的 ID 添加到播放历史列表 `player._playhistory` 中。
接着,通过遍历 `songlistEl` 元素中的每个 `<tr>` 行,来查找当前正在播放的歌曲,并通过添加或删除 `songlist__item--playing` CSS 类名来更新当前播放歌曲的样式。
在播放失败的情况下,弹出一个警告框提示用户无法进行自动播放。
总的来说,该代码段实现了播放歌曲的主要逻辑,包括设置歌曲信息、加载歌曲声音并更新页面上的相应元素。
阅读全文