我在我的网站中使用精美的音乐播放器,并且我有多个播放列表,格式如下:
<div class="playlist">
<a href="mysong.mp3" class="fmp-my-track add_link">add this song</a>
<a href="mysong.mp3" class="fmp-my-track add_link">add this song</a>
<a href="mysong.mp3" class="fmp-my-track add_link">add this song</a>
</div>
<div class="playlist">
<a href="mysong.mp3" class="fmp-my-track add_link">add this song</a>
<a href="mysong.mp3" class="fmp-my-track add_link">add this song</a>
<a href="mysong.mp3" class="fmp-my-track add_link">add this song</a>
</div>
<div class="playlist">
<a href="mysong.mp3" class="fmp-my-track add_link">add this song</a>
<a href="mysong.mp3" class="fmp-my-track add_link">add this song</a>
<a href="mysong.mp3" class="fmp-my-track add_link">add this song</a>
</div>
我希望当用户第一次单击一个播放列表中的任何链接时,它会清除播放列表,并在下次单击时将歌曲添加到播放列表中。例如,当用户单击第一个播放列表中的任何链接时,它会清除播放列表并将歌曲添加到播放列表中,并且在该播放列表中下次单击时,它将不会清除播放列表。当用户第一次单击此处相同的其他播放列表中的任何链接时,它将清除播放列表,然后添加歌曲。我使用下面的代码来实现此目的,但它不起作用:
$(".playlist").each(function(){
$(".add_link").one("click", function(){
$.fancyMusicPlayer.clear();
});
$(".add_link").click(function(){
$.fancyMusicPlayer.addTrack(this.href, this.title, this.target,false);
});
});
将歌曲添加到播放列表中工作正常,但首次单击时清除播放列表的功能不起作用。谁能帮我吗?
最佳答案
您需要保留当前播放列表的引用,以检查新的点击是否来自同一播放列表或另一个播放列表。由于您当前的播放列表元素没有 ID,因此我在下面的示例代码中使用了它们的索引:
var inPlaylist = 0;
$(".add_link").click(function(){
var playlistIndex = $(this).parent('.playlist').index();
if(playlistIndex != inPlaylist){
$.fancyMusicPlayer.clear();
inPlaylist = playlistIndex;
}
$.fancyMusicPlayer.addTrack(this.href, this.title, this.target,false);
});
关于javascript - 需要在多个播放列表中单击事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18180194/