Question

我在标题后附加一个按钮，显示的唯一图标是加号，其他任何东西都不起作用？

的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>

Answer 1

你需要告诉代码有一个新按钮，它不会神奇地了解变化。

$('#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.

Answer 2

您可以在按下这些按钮后trigger尝试create data-role=page addbuttons：

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

以下是演示： http://jsfiddle.net/hungerpain/W7NcY/

你也可以尝试再次发起button：

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

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

演示： http://jsfiddle.net/hungerpain/W7NcY/4/

希望这有帮助。

按钮附加到标题后图标不会更改

2 个答案: