简体   繁体   English

jQuery如何显示隐藏表列

[英]jquery how to show-hide table column

How can I hide a entire table column with jQuery? 如何使用jQuery隐藏整个表格列?

I managed to hide a single td , but not the other 2 td s under it. 我设法隐藏了一个td ,但没有隐藏其他2 td Code to hide table td : 隐藏表td代码:

$("#td_maand").hide(); 

Give all the same column tds the same class, then $(".columnClass").hide(); 给所有相同的列tds提供相同的类,然后$(".columnClass").hide();

eg 例如

<tr><td class="firstcolumn"></td><td class="secondcolumn"></td></tr>
<tr><td class="firstcolumn"></td><td class="secondcolumn"></td></tr>
<tr><td class="firstcolumn"></td><td class="secondcolumn"></td></tr>
<script>$(".firstcolumn").hide();</script>

You can use the nth-child selector to achieve that, use it like this: 您可以使用nth-child选择器来实现该目的,如下所示:

$('#yourtable tr td:nth-child(3)').hide();

that will hide your third column. 这将隐藏您的第三列。

You can do it easily: 您可以轻松做到:

var i = [your_column_index];
$('td:nth-child(' + i + ')').hide();​

You can use 您可以使用

$(this) // assuming this points to a td
  .closest('tbody') // find closest tbody (container)
  .find('> tr > td:nth-child('+$(this).index()+')') // find all td in the same column
  .hide(); // hide them

Demo at http://jsfiddle.net/jFv6d/ 演示在http://jsfiddle.net/jFv6d/
( it hides the clicked column ) 它隐藏了单击的列

尝试$("#td_maand").parent().hide();

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM