Jquery 在Tablesorter上动态添加和删除小部件

在jquery加载开始时-仅使用zebra小部件初始化tablesorter：

$('.tablesorter-blue').tablesorter({
   widthFixed : true,           
   usNumberFormat : false,
   sortReset      : true,
   sortRestart    : true,
   widgets        : ['zebra']
}); 

通过单击按钮，我可以动态添加“滚动器”小部件：

$('.tablesorter-blue').trigger('applyWidgets', true);
$('.tablesorter-blue')[0].config.widgets = ['scroller'];

这样就可以了，因为它添加了scroller小部件，并且还保留了以前的小部件（zebra）

我目前遇到的问题是，再次从tablesorter中删除scroller小部件，只保留zebra小部件。我已尝试这些代码，但失败：

从文档-刷新窗口小部件-：

这是报告的错误：

TypeError: $(...)[0].config is undefined

更新： 按@mottie所给添加的代码-滚动条仍然在那里没有效果

        $('.tablesorter-blue').closest('.tablesorter-scroller').find('.tablesorter-scroller-header').remove();
        $('.tablesorter-blue')
            .unwrap()
            .find('.tablesorter-filter-row').removeClass('hideme').end()
            .find('thead').show().css('visibility', 'visible');
        $('.tablesorter-blue')[0].config.isScrolling = false;

更新日期：2014年2月10日

多亏了widget-scroller.js更新的mottie，问题现在得以解决。我已经用新版本更新了我的代码

如演示所示，这是我添加和删除scroller小部件的代码：

//initialize tablesorter
//THE TRICK IS TO PUT IN A VARIABLE LOL, SO THAT IT CAN BE UPDATED LATER :D
//THANKS AGAIN MOTTIE
var $tblSorter = $('.tablesorter-blue').tablesorter({               
    widgets: ['zebra'] //no SCROLLER
});

//Code for adding scroller
$tblSorter.trigger('refreshWidgets', [true, true]); //REMOVE ALL WIDGETS
$tblSorter[0].config.widgets = ['zebra', 'scroller']; //ADD ZEBRA & SCROLLER
$tblSorter.trigger('applyWidgets');

//Code for removing scroller
$tblSorter.trigger('refreshWidgets', [true, true]); //REMOVE ALL WIDGETS
$tblSorter[0].config.widgets = ['zebra']; //REMOVE THE SCROLLER, RETAIN ZEBRA ONLY
$tblSorter.trigger('applyWidgets');

---

我很难过地说，scroller小部件需要大量的工作和bug修复；这包括在刷新小部件时将其从表中删除

我回答了一个类似的问题，描述了如何做。这是您需要的相关代码：

// remove scroller widget completely
$table.closest('.tablesorter-scroller').find('.tablesorter-scroller-header').remove();
$table
    .unwrap()
    .find('.tablesorter-filter-row').removeClass('hideme').end()
    .find('thead').show().css('visibility', 'visible');
$table[0].config.isScrolling = false;

---

更新：哦，我注意到在上面的代码中，传递给“refreshWidgets”的参数没有用括号括起来。应该是这样的：

$('.tablesorter-blue').trigger('refreshWidgets', [true, true]);

，带有稍微修改的remove小部件代码版本：

$(function () {
    $('#table1').tablesorter();

    var $table2 = $('#table2').tablesorter({
        widgets : ['scroller']
    });

    $('button').click(function(){
        var widgets = $table2[0].config.widgets;
        $table2.trigger('refreshWidgets', [true, true]);
        $table2[0].config.widgets = $.inArray('scroller', widgets) >= 0 ?
            [] : ['scroller'];
        $table2.trigger('applyWidgets');
    });

});

---

对于将来遇到这个问题的其他人来说，自v2.25以来，TableSorter中内置了一个“removeWidget”方法

$('.tablesorter').trigger('removeWidget', ['scroller'])

---

没有效果，滚动条还在，我用你的代码更新了我的问题。不知道也许我没有正确使用它当我测试它时，滚动条消失了一秒钟，然后再次刷新到tablesorter中删除此代码-$（'.tablesorter blue'）[0]。config.isScrolling=false；它工作了，滚动条消失了，但当我点击按钮再次切换滚动条时，它不再工作了。我将等待一个稳定的滚动条小部件用于滚动切换，现在我使用两个表排序器，一个带滚动条，另一个不带-感谢anway的回答，我告诉过你把refreshWidget参数用括号括起来，而我在上面的代码中也没有这么做，哈哈。。。现在更新。

$('.tablesorter').trigger('removeWidget', ['scroller'])