javascript - jQuery Tablesorter 动态加载 CSV

Question

好吧，这让我发疯。

我有一个 csv 文件，我使用 CSVToTable 将其动态加载到 html 表中，然后使用 Tablesorter 对其进行排序。

我遇到的问题是，当我尝试应用“过滤器”等 Tablesorter 小部件时，它们将不适用。

但是当我复制动态加载的 html 表并将它们复制并粘贴到我的源代码中时，它们运行时没有问题。

有人可以向我解释为什么会发生这种情况以及如何动态加载我的 CSV 文件并应用 Tablesorter 小部件吗？

您可以在这里查看我的代码:http://cdemeke.com/Chris_Test/Test14/test4.html

提前非常感谢您!

Answer 1

当 CSVToTable 脚本初始化时，它会触发 loadComplete 事件，然后该事件包含初始化表排序器的代码。以下是需要修改的代码:

$('#CSVTable2')
    .CSVToTable('test2.csv', {
        loadingImage: 'images/loading.gif',
        startLine: 1,
        headers: ['Project Number', ...]
    })
    .bind("loadComplete",function() {
        $('#CSVTable2').find('table')
            .tablesorter({
                widthFixed: true,
                widgets: ['zebra', 'filter']
            })
            .tablesorterPager({
                container: $("#pager")
            });
    });

此外，在 jquery.tablesorter.js 文件的顶部，有以下代码:

$(function() {
    $("table")
        .tablesorter({widthFixed: true, widgets: ['zebra']})
        .tablesorterPager({container: $("#pager")});
});

我认为从这里删除它是一个好主意，因为初始化的顺序在某些浏览器中可能是一个问题。它不应该找到表，因为它尚未构建，但如果找到了，它将强制它找到的所有表使用分页器。如果表已经初始化，则表排序器的额外参数将被忽略。