Плагин jQuery Tablesorter 2.0 ведет себя странно

Question

Я скачал плагин jQuery Tablesorter 2.0 с http://tablesorter.com/jquery.tablesorter.zip и модифицировано пример-pager.html, который находится в каталоге tablesorter / docs

Я написал дополнительные эффекты Rollover:

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

            /** Additional code */
            $("tr").mouseover(function () { 
            $(this).addClass('over');
            });

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

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

            $("tr").dblclick(function () {  
            $(this).removeClass('marked');
            });
            /** Additional code END  */


});

И, конечно, изменил файл themes / blue / style.css:

/* Additional code */
table.tablesorter tbody  tr.odd td {
background-color: #D1D1F0;
}

table.tablesorter tbody  tr.even td {
background-color: #EFDEDE;
}


table.tablesorter tbody  tr.over td {
background-color: #FBCA33;
}

table.tablesorter tbody  tr.marked td {
background-color: #FB4133;
}
/* Additional code END*/

Все это прекрасно работает, НО, когда я перехожу на другие страницы, т.е. на страницы 2, 3 или 4 эффекты пропали! Я очень ценю вашу помощь

Answer 1

Просто к сведению, если вы хотите удалить «помеченный» класс для ранее выбранной строки при нажатии на новую строку, вы можете сделать это:

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

Answer 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")});  
    });

Answer 3

Я также столкнулся с одной проблемой, когда после сортировки окраска строк была испорчена. Я решил это, указав следующее:

$ (# your_table) .tablesorter ({ виджеты: ["зебра"], widgetZebra: {css: ["your_odd_css", "your_even_css"]} });

Теперь это работает хорошо. Нет проблем с окраской.