Question

jquery点击事件获取另一个标签的值

for (i = 0; i < musicList.length; i ) { $(".class").append('<span data-musicicon=' musicList[i].MusicName ' class="music-icon-hook"> <a href="#" title="播放" data-action="play" class="list-micon icon-play"> play </a></span>');} 这里muiscList.length=10，如何点击<a>标签play获取对应的<span>标签data-musicicon里的数据？知道怎么绑定事件，怎么获取单独的<span>里的data-musicicon值，但是不知道怎么对应起来！求大神解决！

Answer 1

你这个a不是在span里面吗，在绑定的事件里直接使用 $(this).parent()就可以获取到包裹它的span了。append之后，就会生成以下dom结构，然后在事件绑定取父元素就好了。
【片段1】
<span data-musicicon="name1" class="music-icon-hook"><a href="#" title="播放" data-action="play" class="list-micon icon-play"></a></span>

....<!-- more -->
<span data-musicicon="name10" class="music-icon-hook"><a href="#" title="播放" data-action="play" class="list-micon icon-play"></a></span>

<script>
【代码】

<div id="div1"></div>
<script>

$(function(){
// 模拟的数据。
var musicList=[{MusicName:'name1'},{MusicName:'name2'},{MusicName:'name3'},{MusicName:'name4'},{MusicName:'name5'},{MusicName:'name6'},{MusicName:'name7'},{MusicName:'name8'},{MusicName:'name9'},{MusicName:'name10'}];
// 以下代码会生成 片段1 的dom
for (i = 0; i < musicList.length; i++) {
$("#div1").append('<span data-musicicon="'+musicList[i].MusicName +'" class="music-icon-hook"> <a href="#" title="播放" data-action="play" class="list-micon icon-play"> play </a></span>');
}
$('.list-micon').each(function(index){
$(this).click(function(){
var span=$(this).parent(); // 获取到a的父元素，即包含它的那个span
alert(span.attr('data-musicicon'));
// 可以对span进行操作了
});
});
});
</script>

追问

恩 不错 谢谢啊！这么详细分给你吧！

Answer 2

对应的span不是a标签的父级吗？这样很好取啊
如：
$("a.icon-play").click(function(){
var musicicon = $(this).parent().attr("data-musicicon");

});

追问

恩 解决了 挺好用 但是你的直接 我给赞 但是分给了楼上了 不好意思啊！谢谢！

Answer 3

$("span").attr()就是获得它的属性值，但span有没有这个属性我就不知道了

追问

解决了 谢谢啊！