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

【问题标题】：Change "data-icon" dynamicly doesn't work动态更改“数据图标”不起作用
【发布时间】：2014-02-28 12:42:43
【问题描述】：

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

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");

有什么想法吗？

更新：标记实际上发生了变化（使用萤火虫），所以似乎有一些刷新问题？

更新 2，感谢 Omar - 现在可以使用了！

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

【问题讨论】：

【解决方案1】：

列表视图项目容纳包含图标的<a> 标签。 data-icon 属性已弃用并替换为 icon 类，可直接添加到 <a> 标签中。

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

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

此外，您需要删除以前的 icon 类。可以通过这种方式以编程方式完成。

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

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

Demo

【讨论】：