Jquery 在动态添加的列上使用tablesorter.js ColumnSelector

我正在从包含列列表的文本文件创建一个表。我的原始表有两列：名称和ID。我读入一个包含各种“分数”的文本文件，然后执行代码：

myform.find('tr').each(function(){
            var trow = $(this);
            if(trow.index() === 0){
                trow.append("<th style=\"width:100px\" data-priority=\"4\" data-sortinitialorder=\"asc\" data-placeholder=\"Ex: 255\">" + score + "</th>");
            }else if(trow.index() === 2){
                trow.append('<td></td>');  //eventually this will add data but right now I'm just testing it so I'm just adding a blank row
            }

然而，我最近尝试包含ColumnSelector小部件，以便用户可以决定显示哪些分数列，但它无法与我添加的列一起工作。当我只有两个原始列时，它可以工作，但当我尝试包含添加的列时，它会破坏列选择器——您可以单击复选框，但它不会更改列。它也不会将任何新列添加到您可以选择的列列表中

---

有人有什么想法吗

看起来您在columnSelector代码中遇到了错误。我已经更新了主分支中的列选择器小部件，因此该补丁在下一版本之前不可用，但您可以

$（函数（）{
var$t=$（‘表’）；
$t.tablesorter({
主题:"蓝色",，
小部件：['zebra'，'columnSelector'，'stickyHeaders']，
widgetOptions：{
//以列选择器标记为目标
columnSelector_容器：$（“#columnSelector”）
}
});
$（“按钮”）。单击（函数（）{
$t.find（'thead tr'）。append（'Data'）；
$t.find（'tbody tr'）。每个（函数（）{
$（this.append）（''+Math.round（Math.random（）*100）+''）；
});
$t.trigger（'updateAll'）；
});
});

看起来您在列选择器代码中遇到了错误。我已经更新了主分支中的列选择器小部件，因此该补丁在下一版本之前不可用，但您可以

$（函数（）{
var$t=$（‘表’）；
$t.tablesorter({
主题:"蓝色",，
小部件：['zebra'，'columnSelector'，'stickyHeaders']，
widgetOptions：{
//以列选择器标记为目标
columnSelector_容器：$（“#columnSelector”）
}
});
$（“按钮”）。单击（函数（）{
$t.find（'thead tr'）。append（'Data'）；
$t.find（'tbody tr'）。每个（函数（）{
$（this.append）（''+Math.round（Math.random（）*100）+''）；
});
$t.trigger（'updateAll'）；
});
});

var resort = true, 
    callback = function(myform){
    };
    $("table").trigger("updateAll", [ resort, callback ]);

$(function() {

  var $t = $('table');
  $t.tablesorter({
    theme: 'blue',
    widgets: ['zebra', 'columnSelector', 'stickyHeaders'],
    widgetOptions: {
      // target the column selector markup
      columnSelector_container: $('#columnSelector')
    }
  });

  $('button').click(function() {
    $t.find('thead tr').append('<th>Data</th>');
    $t.find('tbody tr').each(function() {
      $(this).append('<td>' + Math.round(Math.random() * 100) + '</td>');
    });
    $t.trigger('updateAll');
  });

});