jQuery tablesorter子元素th禁用排序

我有弹出窗口th中的子元素。当我点击.show_history div显示弹出格.show_history_ctn时，触发该列的排序。我已将.show_history的Z-index增加到9999，并且仍然会触发排序。我还将stopPropagation添加到.show_history点击事件，并且仍然发生排序。jQuery tablesorter子元素th禁用排序

jQuery的

$(".show_history").on("click",function(event) { 
     $(this).siblings(".show_history_ctn").find("tr").show(); 
     event.stopPropagation(); 
     if($(this).hasClass("active")) { 
      $(this).siblings(".show_history_ctn").slideUp(); 
      $(this).removeClass("active"); 
     } else { 
      $(".show_history_ctn").hide(); 
      $(".show_history").removeClass("active"); 
      $(this).siblings(".show_history_ctn").slideDown(); 
      $(this).addClass("active"); 
     } 
    }); 

$(".tablesorter").tablesorter();

HTML

<table class='tablesorter'><thead><tr><th><div class='show_history'>Show History</div><div class='show_history_ctn' style='display:none'>**content**</div></th><th></th></tr></thead></table>

我该怎么解决？我需要对列进行排序，否则我只需添加sorter:'false'。

来源

2017-10-18 mdnba50

问题是，由于重新构建表头，点击绑定被tablesorter删除。你能解决这个使用下列方法之一：

将headerTemplate选项为空字符串（""） - 这将阻止改变头内容，因此不会破坏任何绑定。在内部，它使用innerHTML（这很可能会很快改变）来包装内容，因为jQuery的包装在旧版本的IE中速度非常慢。

绑定initialized回调（demo）

$(function() { 

    function bindLink() { 
    $('.link').click(function(e) { 
     e.preventDefault(); 
     e.stopPropagation(); 
    }); 
    } 

    $('table').tablesorter({ 
    theme: 'blue', 
    initialized: bindLink 
    }); 

});

更新里面的弹出链接：哎呀，我忘了，包括需要被添加到元素你“的tablesorter-NOSORT”的cssNoSort class name '点击。演示链接更新如上。

<th>AlphaNumeric <a class="link tablesorter-noSort" href="https://google.com">test</a>

来源

2017-10-18 21:09:25 Mottie

我试了演示，点击弹出链接仍然被忽略，列被排序。 – mdnba50

糟糕，抱歉..我已经更新了我的答案。 – Mottie

jQuery tablesorter子元素th禁用排序

回答

相关问题