动态更改jQuery Mobile列表视图中的图标

时间:2013-02-27 14:56:54

标签: jquery listview jquery-mobile icons

当我动态更改图标时,它不会反映页面上的更改,即使在标记中它已被更改。

示例:

      <ul data-role="listview" data-autodividers="true" data-filter="true" data-inset="true">
        <li data-icon="check"><a href="#">Adam Kinkaid</a></li>
        <li data-icon="check"><a href="#">Alex Wickerham</a></li>
        <li data-icon="check"><a href="#">Avery Johnson</a></li>
        <li data-icon="check"><a href="#">Bob Cabot</a></li>
        <li data-icon="check"><a href="#">Caleb Booth</a></li>
        <li data-icon="check"><a href="#">Christopher Adams</a></li>
        <li data-icon="check"><a href="#">Culver James</a></li>
    </ul>

$("li").tap(function() {
    //Alert the old icon
    alert($(this).jqmData("icon"));

    //Toggle
    $(this).jqmData("icon") == "false" ? $(this).jqmData("icon", "check") :             $(this).jqmData("icon", "false");

    //Alert the new icon
    alert($(this).jqmData("icon"));
});

http://jsfiddle.net/Mc97V/

1 个答案:

答案 0 :(得分:10)

我为你做了一个工作的例子:http://jsfiddle.net/Gajotres/qgE6L/

$('#index').live('pagebeforeshow',function(e,data){    
    $("li").tap(function() {
        $(this).buttonMarkup({ icon: "edit" });
    });  
});