jquery - 多个 jquery 插件不起作用

Question

我尝试添加 tablesorter 和 chromatable。只有可染色的作品。如果我摆脱了 chromtable，那么排序也可以。有没有办法让两者都工作？

<script type="text/javascript">
$(document).ready(function () {

    $.tablesorter.addParser({
        id: 'fancyNumber',
        is: function (s) { return false; },
        format: function (s) {  if (s == '-') return '0'; else return       
    s.replace(/[\,\$]/g, ''); },
        type: 'numeric'
    });

    $("#marginDiff").tablesorter({ 
         headers: {
             1: { sorter: false }, 
             2: { sorter: false }, 
             5: { sorter: 'fancyNumber' }, 
             6: { sorter: 'fancyNumber' }, 
             7: { sorter: 'fancyNumber' }, 
             8: { sorter: 'fancyNumber'}
        } 
    });
    $("#marginDiff").chromatable({ 
        width: "1500px", height: "900px", scrolling: "yes" 
    });
 });
</script>

Answer 1

也许尝试将 Chromatable 绑定到 Tablesorter sortEnd 回调以避免冲突？试一试...

$(document).ready(function() { 

    $.tablesorter.addParser({
        id: 'fancyNumber',
        is: function (s) { return false; },
        format: function (s) {  if (s == '-') return '0'; else return       
    s.replace(/[\,\$]/g, ''); },
        type: 'numeric'
    });

    $("#marginDiff").tablesorter({ 
         headers: {
             1: { sorter: false }, 
             2: { sorter: false }, 
             5: { sorter: 'fancyNumber' }, 
             6: { sorter: 'fancyNumber' }, 
             7: { sorter: 'fancyNumber' }, 
             8: { sorter: 'fancyNumber'}
        } 
    });

});

$("#marginDiff").bind("sortEnd",function() { 
    $(this).chromatable({ 
        width: "1500px", height: "900px", scrolling: "yes" 
    });
});