jQuery TableSorter插件

Question

我正在使用tablesorting jquery插件，我有一点麻烦。

我有一个包含10列的表，我有一个过滤器，如果我取消选中一个框，则使用CSS display:none从表中删除关联的列。

这一切都运行正常，但当我使用分页时，会显示这些详细信息。

表格分类器插件似乎会重新关联表格数据并显示所有行，即使它们设置为display:none

有没有办法，如果这些列没有显示/隐藏，那么当分页被触发时，它们不会显示？

由于

编辑：

    $("#searchContainer #toggleOptions ul li a").on(

          {click: function()

                  {

                      //detect classes
                      var currentButtonCnt = $(this).parent().attr("class");
                      var currentState = $(this).attr("class");

                      //remove _btn
                      currentButton = "."+currentButtonCnt.substr(0, currentButtonCnt.length-4); 

                       var ids = [];
                      //toggle  
                      if(currentState == "ticked"){

                              $(currentButton).hide();
                              $(this).removeClass('ticked')

                      }else{

                              $(currentButton).show();  
                              $(this).addClass('ticked')

                      }

                 }

          }//end click 

    )

Answer 1

看起来每次切换每行/每列的页面时，Tablesorter的寻呼机插件都会交换<td>个元素。我猜您的display:none样式仅适用于您要隐藏的当前显示的<td>，因此每当您翻到下一页时，新的<td>都会被翻转，并且不受display:none功能的影响。

假设您的函数循环遍历<table>，并根据检查的<td>找到要隐藏的checkbox的正确列，您应该可以通过调用您的问题来解决问题每次点击寻呼机下一个和上一个按钮时隐藏相应列on click的功能。

修改

您可以按如下方式将Next和Prev按钮选择器添加到您的函数中：

//Add .next and .prev selectors here to your click function
$("#searchContainer #toggleOptions ul li a, .next, .prev").on(

          {click: function()

                  {

                      //detect classes
                      var currentButtonCnt = $(this).parent().attr("class");
                      var currentState = $(this).attr("class");

                      //remove _btn
                      currentButton = "."+currentButtonCnt.substr(0, currentButtonCnt.length-4); 

                       var ids = [];
                      //toggle  
                      if(currentState == "ticked"){

                              $(currentButton).hide();
                              $(this).removeClass('ticked')

                      }else{

                              $(currentButton).show();  
                              $(this).addClass('ticked')

                      }

                 }

          }//end click 

    )

看起来，Tablesorter页面插件将类默认为.next和.prev。点击此处：http://tablesorter.com/docs/example-pager.html并检查按钮元素。