当按钮附加到标题时图标不改变

icon not changing when button appended to header

本文关键字:图标 改变 标题 按钮      更新时间:2023-09-26

我在标题中添加了一个按钮,唯一出现的图标是plus,其他任何东西都不起作用??

JavaScript

$('#addbuttons').append('<a href="#" data-role="button" data-inline="true" data-iconpos="notext" data-icon="gears" data-theme="b">Edit</a>');
$('#addbuttons').append('<a href="#newevent1" data-role="button" data-iconpos="notext" data-inline="true" data-icon="plus" data-theme="b" data-rel="dialog">New Event</a>');
HTML

    <div data-role="header">
    <h1 class="ui-title" role="heading" id="hdr"></h1>
    <div class="ui-btn-right" id ="addbuttons" data-role="controlgroup" data-type="horizontal">
    </div>

您需要告诉代码有一个新按钮,它不会神奇地拾取更改。

$('#addbuttons')
    .append('<a href="#newevent1" data-role="button" data-iconpos="notext" data-inline="true" data-icon="plus" data-theme="b" data-rel="dialog">New Event</a>')
    .find("a")
        .button()
        .button('refresh'); //<- probably not needed, put it here just in case. 

您可以尝试triggerdata-role=page上添加create按钮到addbuttons后,像这样:

$("[data-role=page]").trigger("create");

下面是一个演示:http://jsfiddle.net/hungerpain/W7NcY/

你也可以尝试再次启动button,像这样:

$("[data-role=button]").button();

但是你最终会失去圆角。我注意到在按钮init中添加corners : true并没有帮助。

Demo: http://jsfiddle.net/hungerpain/W7NcY/4/