jQuery .data（）不起作用，但.attr（）可以原谅我没有更具体的这一点。我有这么奇怪的错误。在doc加载之后，我循环了一些原来的元素data-itemname=""，并使用它来设置这些值.attr("data-itemname", "someValue")。问题：当我后来循环通过这些元素时，如果我这样做elem.data().itemname，我会得到""，但如果我这样做elem.attr("data-itemname")，我会得到"someValue"。这就像jQuery的.data()getter只获取最初设置为包含某些值的元素，但如果它们最初是空的，稍后设置，则稍后.data()不会获得该值。我一直试图重新创建这个bug，但一直没能。编辑我重新创建了这个bug！http://jsbin.com/ihuhep/edit#javascript,html,live另外，链接上面的片段......JS：var theaters = [
{ name: "theater A", theaterId: 5 },
{ name: "theater B", theaterId: 17 }];$("#theaters").html(
$("#theaterTmpl").render(theaters));// DOES NOT WORK - .data("name", "val") does NOT set the valvar theaterA = $("[data-theaterid='5']");theaterA.find(".someLink").data("tofilllater", "theater5link"); // this does NOT set data-tofilllater$(".someLink[data-tofilllater='theater5link']").html("changed link text"); // never gets changed// WORKS - .attr("data-name", "val") DOES set valvar theaterB = $("[data-theaterid='17']");theaterB.find(".someLink").attr("data-tofilllater", "theater17link"); // this does set data-tofilllater$(".someLink[data-tofilllater='theater17link']").html("changed link text");HTML：<body>
<div id="theaters"></div></body><script id="theaterTmpl" type="text/x-jquery-tmpl">
<div class="theater" data-theaterid="{{=theaterId}}">
<h2>{{=name}}</h2>
<a href="#" class="someLink" data-tofilllater="">need to change this text</a>
</div></script>
3 回答
拉丁的传说
TA贡献1789条经验 获得超8个赞
几天前，当我使用.data()和.attr('data-name')处理HTML5数据属性时，我遇到了类似的“bug” 。
您描述的行为不是错误，而是设计。
该.data()调用是特殊的 - 它不仅检索HTML5数据属性，还尝试评估/解析属性。因此，使用像data-myjson='{"hello":"world"}'检索到的属性.data()将返回一段Object时间检索通过.attr()将返回一个字符串。参见jsfiddle示例。
因为.data()额外的处理jQuery存储了属性评估的结果$.cache- 毕竟，一旦评估了数据属性，在每次.data()调用时重新评估将是浪费- 特别是因为数据变量可以包含复杂的JSON字符串。
我说了以下所有内容：通过后续调用后不会看到的任何更改检索属性后。.data().attr('data-myvar', '').data() 在jsfiddle上测试一下。
为了避免这个问题，请不要混合.data和.attr()调用。使用其中一个。
繁花如伊
TA贡献2012条经验 获得超12个赞
那是因为属性的名字是data-itemname。您不能使用-简写obj.attribute表示法（obj.data-itemname将被解释为“obj.data minus itemname”）。
- 3 回答
- 0 关注
- 1375 浏览
添加回答
举报
0/150
提交
取消