javascript - 如何使用 jquery 隐藏列？

Question

我是 jQuery 和 JavaScript 的新手。我正在处理一个包含一些信息的表格，但我必须隐藏包含所有单元格和包含信息的 3 列。我的 JS 代码是这样的:

 $.each(currentParams.columns[0], function (index, column) {
if (column.field == 'columnAdress' || column.type == 'columnTime'
    || column.type == 'columnMail' || column.type == 'columnPhone'
     || column.type == 'project') {
    column.hidden = true;
} else {
    visibleColumns++;
}

在表中，该列被隐藏，但仍保留明显的空白空间。它是这样的:

我的问题是:有没有更好的方法可以在没有剩余空白的情况下做到这一点？

Answer 1

简单的例子，visibility:hidden 仍然占用网页上的空间，就好像该元素在那里一样，而 display none 则不然。而不是column.hidden = true;使用column.hide();

$('#visibilitybutton').click(function(){
       $('#visibilityhidden').css("visibility","hidden");
                                       
                            });

$('#displaybutton').click(function(){
       $('#displaynone').hide();
                                       
                            });

div{border:1px solid red;margin:2px;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>jhfbvjhfvhv</div>
<div id="visibilityhidden">lurisghselkvhlguhgww</div>
<div>jkfgbhnr;br;</div>
<div id="displaynone">jskvsr;vnoive</div>
<div>eusvhsrkvjrlkj</div>
<button id="visibilitybutton">Click to hide visibility div</button>
<button id="displaybutton">Click to hide display div</button>