如何更改列表视图项的图标

【问题标题】：How to change the icon of a listview item如何更改列表视图项的图标
【发布时间】：2014-01-25 13:58:09
【问题描述】：

我有以下标记：

<ul id="menu" data-role="listview">
    <li><a href="/">Home</a></li>
    <li class="label"><a href="#">About</a></li>
    <li><a href="/">About Us</a></li>
    <li><a href="/">Contact Us</a></li>
    <li class="label"><a href="#">More</a></li>
    <li><a href="/">FAQs</a></li>
    <li><a href="/">Terms</a></li>
</ul>

如何将所有label 元素的图标从> 更改为+？我试过了：

$(".label").buttonMarkup({ icon: "plus" });

其中worked in v1.3.0 生成unexpected results in v1.4.0。

【问题讨论】：

更新了我的答案。对不起，我误会了。

标签： jquery css jquery-mobile jquery-mobile-listview

【解决方案1】：

更新

我刚刚意识到您想更改具有 label 类的元素的图标。

您首先需要删除以ui-icon- 开头的旧类，然后添加ui-icon-plus。

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

Demo

使用.buttonMarkup() 是不正确的，它只能用于锚。无论如何，该功能已被弃用，并将在 1.5 中删除。

以下是对 listview 小部件进行更改的正确方法。

$(document).on("pagebeforecreate", function () {
  $("#menu").listview({
    icon: "plus"
  });
});

Demo

【讨论】：

@SalmanA 你的意思是ui-btn-icon-？它只删除以ui-icon- 开头的类。