jQuery 插件 Tablesorter 2.0 行为怪异答案

【问题标题】：jQuery plugin Tablesorter 2.0 behaves weirdjQuery 插件 Tablesorter 2.0 行为怪异
【发布时间】：2010-05-18 06:34:42
【问题描述】：

我从这里下载了 jQuery 插件 Tablesorter 2.0 http://tablesorter.com/jquery.tablesorter.zip 并修改 tablesorter/docs 目录中的 example-pager.html

我写了额外的翻转效果：

$（函数（）{ $("表") .tablesorter({widthFixed: true, 小部件: ['zebra']}) .tablesorterPager({container: $("#pager")}); /** 附加代码 */ $("tr").mouseover(函数 () { $(this).addClass('over'); }); $("tr").mouseout(function () { $(this).removeClass('over'); }); $("tr").click(函数 () { $(this).addClass('marked'); }); $("tr").dblclick(function () { $(this).removeClass('marked'); }); /** 附加代码 END */ });

当然也修改了themes/blue/style.css文件：

/* 附加代码 */ table.tablesorter tbody tr.odd td { 背景颜色：#D1D1F0； } table.tablesorter tbody tr.even td { 背景颜色：#EFDEDE； } table.tablesorter tbody tr.over td { 背景颜色：#FBCA33； } table.tablesorter tbody tr.marked td { 背景颜色：#FB4133； } /* 附加代码 END*/

这一切都很好，但是当我进入更多页面时，即第 2 3 或 4 页效果没了！非常感谢您的帮助

【问题讨论】：

标签： jquery effects tablesorter rollover pager

【解决方案1】：

仅供参考，如果您希望在单击新行时删除先前选择的行的“标记”类，您可以这样做：

$("tr").click(function () { 
  $("tr.selected").removeClass('marked');
  $(this).addClass('marked');
});

【讨论】：

【解决方案2】：

我解决了这个问题。

我只是在放置翻转和标记效果后调用寻呼机函数，代码如下：

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

            $("tr").mouseover(function () { 
            $(this).addClass('over');
            });

            $("tr").mouseout(function () {  
            $(this).removeClass('over');
            });

            $("tr").click(function () { 
            $(this).addClass('marked');
            });

            $("tr").dblclick(function () {  
            $(this).removeClass('marked');
            });

        $("table").tablesorterPager({container: $("#pager")});  
    });

【讨论】：

谢谢老兄....你为我节省了很多时间 :-)....这个问题我快疯了。

【解决方案3】：

在对行着色进行排序后，我也遇到了一个问题。我通过指定以下内容解决了它：

$(#your_table).tablesorter({ 小部件：[“斑马”]， widgetZebra: {css: ["your_odd_css","your_even_css"]} });

现在效果很好。没有着色问题。

【讨论】：