需要在多个播放列表中单击事件
Need single click event in multiple playlists
我在我的网站上使用了花哨的音乐播放器,我有多个播放列表,格式如下:
<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);
});
您有一个选择器问题。您希望对每个播放列表进行迭代,并将行为分配给每个播放列表中的每个add_link。但您所做的是将行为分配给页面上的每个add_link,而不是每个播放列表中的行为$('.add_link')每次迭代都会抓取页面上的每一项。
你应该这样做:
$('.playlist').each(function() {
$(this).find('.add_link').one(...);
$(this).find('.add_link').click(...);
});
相关文章:
- 将单击事件添加到数据表
- 将单击事件添加到附加的项目中
- 在IE8中不起作用的元素上触发单击事件
- 链接上的IE10 jquery句柄单击事件不起作用
- 如何使用纯 JavaScript 在所有浏览器中区分左/右/中键单击事件
- 如何在master中调用细节网格作为单击事件
- 兰吉 |如何在 span 标签上使用单击事件删除突出显示的文本
- 如何隐藏按钮单击事件上的占位符
- 复选框,然后单击事件处理
- 如何使用for循环添加所有按钮'单击事件
- 手柄'img'单击事件并插入'alt'使用jQuery将属性转换为文本框
- 覆盖单击事件不起作用
- 单击事件打开两个弹出菜单
- 单击事件不起作用
- 从其他元素上的单击事件访问image src属性
- 单击事件中的ajax请求后重定向
- 如何缩放地图框传单中的标记单击事件
- 在没有焦点的情况下捕获画布上的第一次单击事件
- 通过单击事件识别画布上的对象
- 如何将单击事件添加到JQuery中动态添加的元素中