使用JQuery从JSON创建HTML表，尝试使用Tablesorter插件进行排序，但无法正常工作

我在使用tableorter处理使用JSON数据中的JQuery创建的HTML表时遇到了一些麻烦。 我创建了表格，当我点击它们时列标题突出显示但它没有对数据进行排序。 创建表的JQuery是这样的：

function buildHtmlTable() { var columns = addAllColumnHeaders(myList); for (var i = 0 ; i < myList.length ; i++) { var row$ = $(''); for (var colIndex = 0 ; colIndex < columns.length ; colIndex++) { var cellValue = myList[i][columns[colIndex]]; if (cellValue == null) { cellValue = ""; } row$.append($('').html(cellValue)); } $("#excelDataTable").append(row$); } } function addAllColumnHeaders(myList) { var columnSet = []; var headerTr$ = $(''); for (var i = 0 ; i < myList.length ; i++) { var rowHash = myList[i]; for (var key in rowHash) { if ($.inArray(key, columnSet) == -1){ columnSet.push(key); headerTr$.append($('').html(key)); } } } $("#excelDataTable").append(headerTr$); return columnSet; } 

这构建了表，并且具有tablesorter所需的THEAD和TBODY标记。 然后我创建表并运行tablesorter函数，如下所示：

 $(document).ready(function() { buildHtmlTable(); $('#excelDataTable').tablesorter(); }); 

这是HTML：

当我点击表格标题时，它们会被一个蓝色框突出显示（就像他们知道被点击一样），但它们没有排序。 我认为它与动态创建表有关，因为tablesorter将使用硬编码的HTML表。 但对于这个应用程序，我将获取JSON数据，并将需要根据我收到的内容构建表。 表数据不会动态变化，只是以这种方式创建。 任何帮助表示赞赏，如果需要，肯定会发回更多详细信息。 提前致谢！

Answer 1

Mottie建议使用构建小部件对我有用。 我将包含数据的文件格式从JSON更改为CSV。 Javascript是

 $(function() { $('#excelDataTable').tablesorter({ theme: 'blue', widgets: ['zebra'], widgetOptions: { // *** build widget core *** build_type : 'csv', build_source : { url: 'data.txt', dataType: 'text' }, build_headers : { widths : ['50%'] } } }); }); 

HTML就是这么简单

此外，我确实需要进行一些调整以使chrome能够使用本地托管文件，但这在IE中可以直接使用。