jQuery Mobile无法刷新按钮样式

Question

当我尝试使用以下代码在JQuery中创建元素时：

$('#grid').append('<div id="gridElement'+counter+'" class="ui-block-'+rowLetter(counter)+'"></div>');
$('#gridElement'+counter).append('<div id="gridContent'+counter+'" data-inline="true"></div>');
$('#gridContent'+counter).append('<a id="button'+counter+'" href="#" data-role="button"></a>');
$('#button'+counter).html('someButtonText');

元素已经正确添加，但是JQuery Mobile样式没有生效。这有点合理，我知道库在加载时会对DOM进行一些操作，但我无法找到一种方法来命令它发生。显然，我需要指示JQuery Mobile库重建页面，但是我却找不到通用的方式来实现这一点。我已经成功地找到了一些关于选择框和列表存在此问题的帖子，但是对于页面、网格或按钮，则没有任何内容。目前是否可能实现这一点？它仍处于alpha测试阶段，所以可能还没有。

- monitorjbl

---

嗨，你解决了吗？我有同样的问题：一些<a>按钮是动态添加的，但没有采用它们的样式。 - Steve

Answer 1

不需要刷新整个

页面，可以这样做：

• 如果您想要刷新data-role=collapsible，请使用collapsible()函数
• 如果您想要刷新data-role=button，请使用button()函数

示例：

$('#bank_content div[data-role=collapsible]').collapsible();
$('#garden_content a[data-role=button]').button();

- Okhi

Answer 2

以下是在我个人案例中有效的方法：

我有一个列表视图，其中包含不同的元素，每个元素都有一个 data-role="controlgroup" 属性，并且其中包含拆分按钮：

<ul id="my-list" data-role="listview" data-split-theme="a">
    <li class="list-element">
        <div class="listview-buttons" data-role="controlgroup" data-type="horizontal" >
            <a href="#" data-role="button" data-icon="delete" data-iconpos="top">REMOVE</a>
            <a href="#" data-role="button" data-icon="arrow-r" data-iconpos="top">SELECT</a>
        </div>  
    </li>
    <li class="list-element">
        <div class="listview-buttons" data-role="controlgroup" data-type="horizontal" >
            <a href="#" data-role="button" data-icon="delete" data-iconpos="top">REMOVE</a>
            <a href="#" data-role="button" data-icon="arrow-r" data-iconpos="top">SELECT</a>
        </div>
    </li>
</ul>

在使用 JavaScript 动态添加另一个包含新的分裂按钮的列表元素后，需要刷新列表、控制组和按钮，代码如下：

$('#my-list').listview('refresh'); //refresh listview first
$('.listview-buttons').children('a').buttonMarkup(); //refresh the buttons
$('.listview-buttons').controlgroup('refresh'); // then refresh the controlgroup

希望这也能对你有所帮助。

- user1400606

Answer 3

我想补充一下，如果您正在尝试刷新控件组，则这对我有用。

.buttonMarkup()

- imaginethepoet