Question

我有一个jQuery DataTable，我想添加html tr行。这些行以html字符串的形式出现。我可以使用标准的jQuery将这些添加到表中，但这意味着它们会绕过DataTable对象，并在使用表时丢失。使用DataTable rows.add（）函数意味着我需要数组格式的行。

// table_rows actually comes from an ajax call. 
var table_rows = '<tr>...</tr><tr>...</tr><tr>...</tr>';

// This successfully adds the rows to the table... :-)
$('#datatable_id').append(table_rows);

// ...but those rows are lost when we redraw the DataTable. :-(
table = $("#datatable_id").DataTable();
table.order([0,'desc']).draw();

不幸的是，我无法轻易改变从服务器返回的内容，因此我似乎需要一个客户端解决方案。

Answer 1

您不应直接操作表并使用适当的jQuery DataTables API方法。

您可以使用rows.add() API方法在提供tr个节点时添加多行。您可以从服务器响应构建tr个节点。

例如：

var table_rows = '<tr><td>Tiger Nixon</td><td>System Architect</td><td>Edinburgh</td><td>61</td><td>2011/04/25</td><td>$320,800</td></tr>';

table.rows.add($(table_rows)).draw();

请参阅this jsFiddle以获取代码和演示。

Answer 2

如果您要添加多个tr，如下所示。

var table_rows = '    <tr><td>Tiger Nixon</td><td>System Architect</td><td>Edinburgh</td><td>61</td><td>2011/04/25</td><td>$320,800</td></tr>      \r\n<tr><td>Tiger Nixon</td><td>System Architect</td><td>Edinburgh</td><td>61</td><td>2011/04/25</td><td>$320,800</td></tr>';

在上面的字符串中，</tr>和<tr>标记与\r\n之间有空格。您需要删除这些空格和\r\n标签。

obj = obj.replace(/^\s*|\s*$/g, '');
obj = obj.replace(/\\r\\n/gm, '');

var expr = "</tr>\\s*<tr";
var regEx = new RegExp(expr, "gm");
var newRows = obj.replace(regEx, "</tr><tr");                        
myDataTable.rows.add($(newRows)).draw();

上面的代码解决了我的问题。

如何从html字符串

2 个答案: