动态更改“数据图标”不起作用

Question

根据我自己的说法，这应该可行....尝试在可折叠/可折叠集内的列表视图项目上更改图标

var p = $("#mySet li[data-item='"+ item + "'][data-bin='"+ bin + "']").attr("data-icon");

如果我发出警报（p），我会“carat-r”，这就是图标。

但应用此方法无效：

$("#mySet li[data-item='"+ item + "'][data-bin='"+ bin + "']").attr("data-icon", "check");

有什么想法吗？

更新：实际上标记更改（使用firebug），所以似乎有一些刷新问题？

更新2，感谢Omar - 立即行动！

$("#mySet li[data-item='"+ item + "'][data-bin='"+ bin + "'] a").removeClass("ui-icon").addClass("ui-icon-check");

Answer 1

列表视图项可容纳包含图标的<a>标记。不推荐使用data-icon属性，并将 icon 类替换为<a>标记。

但是，在列表视图项中，创建列表视图后会添加图标类。要更改li的图标，您需要将其直接添加到li的锚中。

$("li a").addClass("ui-icon-check");

此外，您需要删除之前的图标的课程。它可以通过这种方式以编程方式完成。

$(".selector a").removeClass(function (i, uiClass) {
  return (uiClass.match(/\bui-icon-\S+/g) || []).join(' ');
}).addClass("ui-icon-check");

这将删除当前的图标，并将其替换为ui-icon-check。

  

<强> Demo