1

到目前为止，我有下面的代码工作。我唯一的问题是当表格插入其父 div 时，没有应用 HTML 表格的关联样式。解决此问题的最佳方法是什么？我将 jQuery 与 jQuery mobile 结合使用。

var tableBase = '<table data-role="table" id="score-table" style="margin-left: auto; margin-right: auto;" class="ui-responsive table-stroke ui-table ui-table-reflow"><thead><tr><th data-priority="1">Event</th><th data-priority="2">Score</th></tr></thead><tbody>';
function buildTable(data) {
     var tableCopy = tableBase;
     data.forEach(function(element, index, array) {
         tableCopy = tableCopy + '<tr><td>' + element.event + '</td><td>'
            + element.points + '<td></tr>';
      });
tableCopy = tableCopy + '</tbody></table>';
return tableCopy;
}

然后我有一个#('#targetDiv').html(buildTable(myData))将表格html插入到它的div中。除了未应用样式外，一切正常。我正在使用来自 jQuery mobile 的响应式/重排表。

4

1 回答 1

1

我认为您在将表插入 DOM 后也重新运行了该表的插件：http: //jquerymobile.com/demos/1.2.0-alpha.1/docs/pages/page-dynamic.html

// Pages are lazily enhanced. We call page() on the page
// element to make sure it is always enhanced before we
// attempt to enhance the listview markup we just injected.
// Subsequent calls to page() are ignored since a page/widget
// can only be enhanced once.
$page.page();

// Enhance the listview we just injected.
$content.find( ":jqmData(role=listview)" ).listview();
于 2013-01-16T08:56:02.910 回答