粘头不会根据我的变化更新

我有很多用Angular创建的复选框。每个复选框控制表中列的外观。因此，如果我点击3号复选框，那么表的3号列将不再可见。

我通过简单地执行

$('#dynamic tr > *:nth-child('+idx+')').toggle();

的事情是，粘头是从javascript文件创建的，不会遵循我的实际表。因此，当第2列应该被删除时，它将坚持显示它。

我认为，如果我运行这个每次我隐藏或显示一个列，然后它会正确更新，但如果你这样做，即使标题确实更新，由于某种原因，很多空白空间开始出现在每次点击后。如果点击次数超过几次，页面就会变慢。

由于粘头的代码是在javascript代码中生成的，我试图隐藏和显示适当的项目，就像我用实际的表做的一样。

$('.sticky-thead th > *:nth-child('+idx+')').toggle(); 

这没有任何影响。有人能想出一个更好的方法来使粘头动态，所以它只显示那些在我的表中可见的项目，在每一刻?

编辑

我提到的javascript文件包含以下代码，用于生成一种粘头。

$(function(){
    $('table').each(function() {
        if($(this).find('thead').length > 0 && $(this).find('th').length > 0) {
            var $w     = $(window),
                $t     = $(this),
                $thead = $t.find('thead').clone(),
                $col   = $t.find('thead, tbody').clone();
            $t
            .addClass('sticky-enabled')
            .css({
                margin: 0,
                width: '100%'
            }).wrap('<div class="sticky-wrap" />');
            if($t.hasClass('overflow-y')) $t.removeClass('overflow-y').parent().addClass('overflow-y');
            $t.after('<table class="sticky-thead" />');
            if($t.find('tbody th').length > 0) {
                $t.after('<table class="sticky-col" /><table class="sticky-intersect" />');
            }
            var $stickyHead  = $(this).siblings('.sticky-thead'),
                $stickyCol   = $(this).siblings('.sticky-col'),
                $stickyInsct = $(this).siblings('.sticky-intersect'),
                $stickyWrap  = $(this).parent('.sticky-wrap');
            $stickyHead.append($thead);
            $stickyCol
            .append($col)
                .find('thead th:gt(0)').remove()
                .end()
                .find('tbody td').remove();
            $stickyInsct.html('<thead><tr><th>'+$t.find('thead th:first-child').html()+'</th></tr></thead>');
            var setWidths = function () {
                    $t
                    .find('thead th').each(function (i) {
                        $stickyHead.find('th').eq(i).width($(this).width());
                    })
                    .end()
                    .find('tr').each(function (i) {
                        $stickyCol.find('tr').eq(i).height($(this).height());
                    });
                    $stickyHead.width($t.width());
                    $stickyCol.find('th').add($stickyInsct.find('th')).width($t.find('thead th').width())
                },
                repositionStickyHead = function () {
                    var allowance = calcAllowance();
                    if($t.height() > $stickyWrap.height()) {
                        if($stickyWrap.scrollTop() > 0) {
                            $stickyHead.add($stickyInsct).css({
                                opacity: 1,
                                top: $stickyWrap.scrollTop()
                            });
                        } else {
                            $stickyHead.add($stickyInsct).css({
                                opacity: 0,
                                top: 0
                            });
                        }
                    } else {
                        if($w.scrollTop() > $t.offset().top && $w.scrollTop() < $t.offset().top + $t.outerHeight() - allowance) {
                            $stickyHead.add($stickyInsct).css({
                                opacity: 1,
                                top: $w.scrollTop() - $t.offset().top
                            });
                        } else {
                            $stickyHead.add($stickyInsct).css({
                                opacity: 0,
                                top: 0
                            });
                        }
                    }
                },
                repositionStickyCol = function () {
                    if($stickyWrap.scrollLeft() > 0) {
                        $stickyCol.add($stickyInsct).css({
                            opacity: 1,
                            left: $stickyWrap.scrollLeft()
                        });
                    } else {
                        $stickyCol
                        .css({ opacity: 0 })
                        .add($stickyInsct).css({ left: 0 });
                    }
                },
                calcAllowance = function () {
                    var a = 0;
                    $t.find('tbody tr:lt(3)').each(function () {
                        a += $(this).height();
                    });
                    if(a > $w.height()*0.25) {
                        a = $w.height()*0.25;
                    }
                    // Add the height of sticky header
                    a += $stickyHead.height();
                    return a;
                };
            setWidths();
            $t.parent('.sticky-wrap').scroll($.throttle(250, function() {
                repositionStickyHead();
                repositionStickyCol();
            }));
            $w
            .load(setWidths)
            .resize($.debounce(250, function () {
                setWidths();
                repositionStickyHead();
                repositionStickyCol();
            }))
            .scroll($.throttle(250, repositionStickyHead));
        }
    });
});