2 sunny desmond sunny_desmond 于 2016.03.08 12:03 提问

关于jquery 获取data属性值的问题

 <ul class="pics">
                    <li><a id="img1" href="javascript:choose(1);" title="梦幻玫瑰套装" data-img="1.png">梦幻玫瑰套装</a></li>
</ul>

  function choose(index){
    var data=$(".pics li:eq("+index+") a").data("img");
    alert(data);
}

为什么一直获取到undefined?求大神指导!

7个回答

caozhy
caozhy   Ds   Rxr 2016.03.08 12:16

调试下index多少,有没有找到a标签。

sunny_desmond
sunny_desmond 感谢感谢
接近 2 年之前 回复
sunny_desmond
sunny_desmond   2016.03.08 12:18

可是我用
var data=$("#img1").data("img");也不行。。。。

sunny_desmond
sunny_desmond   2016.03.08 12:33

已解决了,发现公司用的JQ版本太低了。。。。。用新版本后就可以啦

Royal_lr
Royal_lr   Ds   Rxr 2016.03.08 13:26

版本是有多低

sunny_desmond
sunny_desmond 很低。。。
接近 2 年之前 回复
showbo
showbo   Ds   Rxr 2016.03.08 13:47

你那个是自定义属性,用attr,而且要写全来。data是存储数据,不是属性,你需要调用data('img','xxx')这样才能使用data('img')获取

   function choose(index){
    var data=$(".pics li:eq("+index+") a").data("data-img");
    alert(data);
}
sunny_desmond
sunny_desmond 大神,您好这个已经试过了哎,确实是公司JQ版本太低了呢,换上新版本的JQ CDN 就行了,然后这个data的这个用法我也生效了呢
接近 2 年之前 回复
sunny_desmond
sunny_desmond   2016.03.08 19:08

改版后的

 <ul class="pics">
                    <li><a href="javascript:choose(1);" title="梦幻玫瑰套装" data-img="1.png">梦幻玫瑰套装</a></li>
                    <li><a href="javascript:choose(2);" title="代币*40" data-img="2.png">代币*40</a></li>
                    <li><a href="javascript:choose(3);" title="高级经验糖果" data-img="3.png">高级经验糖果</a></li>
                    <li><a href="javascript:choose(4);" title="怦然心动(绿)1天" data-img="4.png">怦然心动(绿)1天</a></li>
                    <li><a href="javascript:choose(5);" title="柠檬花开套装" data-img="5.png">柠檬花开套装</a></li>
                    <li><a href="javascript:choose(6);" title="珍爱巧克力*4" data-img="6.png">珍爱巧克力*4</a></li>
                    <li><a href="javascript:choose(7);" title="彩虹桥 1天" data-img="7.png">彩虹桥 1天</a></li>
                    <li><a href="javascript:choose(8);" title="幸运宝石*40" data-img="8.png">幸运宝石*40</a></li>
                    <li><a href="javascript:choose(9);" title="香奈儿の恋套装" data-img="9.png">香奈儿の恋套装</a></li>
                </ul>
 function choose(index){
    var data=$(".pics li:eq("+(index-1)+") a").data("img");
    // alert(data);
    var img=$("<img src='images/"+data+"' />");
    var src=img.attr("src");
    var divNum= $(".img").children().length;
    if(divNum==0){
    $(".img").append(img);

    }else{
        $("img").attr("src",src);
    }
}
WinsenJiansbomber
WinsenJiansbomber   2016.03.08 22:42

大神你的选择器是我见过最复杂的!如果JQ真能识别说明JQ真的好用!,不过怕你不知道它选中的是什么!还有想要使用标签上的数据不用这么复杂,用属性方法就可以了$("div").attr("rel","value"),,读取时用$("div").attr("rel")

sunny_desmond
sunny_desmond 这个选择器 我不知道还能怎么写,这样的写法 是可以确定具体的选择的值的。然后你说的attr方法我也试了一下,也可以,现在不知道attr与data方法在解决类似问题的时候,怎么选用。
接近 2 年之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
准确详细的回答,更有利于被提问者采纳,从而获得C币。复制、灌水、广告等回答会被删除,是时候展现真正的技术了!