JQuery按钮样式在导航栏中工作，但不在表中

Question

我在导航栏中使用了与表格中完全相同的代码，但它似乎不起作用。

我使用的是js / jquery.mobile-1.1.1.min.js和Phonegap（Cordova）

以下是所发生情况的屏幕截图：

我正在使用此html代码创建导航栏按钮：

<div data-role="header">
    <a href="." data-icon="back" class="back ui-btn-left" data-rel="back">Back</a>
    <h1>Conversion List</h1>
</div>

要在表格中生成按钮，我使用JavaScript循环遍历本地数据库表中的每个值，并在屏幕html表格中打印这些值。

我有html代码：

<div data-role="content">
<!--table which outputs the conversions stored in the database-->
    <table id="viewConversions"width="100%"text-align="center" >
    </table>
    </br>
    <a href="#drugs" data-role="button" id="btnlist">Add new conversion</a>
</div>

和JavaScript代码：

$('#viewConversions').append('<tr><td>'+drug+'</td><td>'+route+'</td><td>'+ conversion +'</td><td>' +output+'</td><td><a href="" id="' + cid + '"data-icon="back" class="back ui-btn-left" data-rel="back"</a>Back</td></tr>');

JQuery扩展不能在表中工作，还是我做错了什么？

Answer 1

这将触发pagecreate

$('#page-id').trigger('pagecreate');

Answer 2

通过将这段代码添加到JavaScript中来解决问题：

data-role="button"

这允许jquery实现它是一个按钮。

然后在我的JavaScript行下面：

$("#conversionlist").trigger('pagecreate');
$("#viewConversion").listview("refresh");