使用jQuery隐藏表的列/td [英] hide column/td of the table by using jquery

问题描述

我们如何使用jquery隐藏表的列

How can we hide the column of the table by using jquery

< table >
  < tr >
   < td id="td_1" >name</ td >
   < td id="td_2" >title</ td >
   < td id="td_3" >desc</ td >
  </ tr >
  < tr >
   < td id="td_1" >Dave</ td >
   < td id="td_2" >WEB DEV</ td >
   < td id="td_3" >Blah Blah</ td >
  < /tr >
  < tr >
   < td id="td_1" >Nick< /td >
   < td id="td_2" >SEO< /td >
   < td id="td_3" >Blah Blah and blah< /td >
  < /tr >
< /table >

因此，假设有人要在所有行中隐藏第一列(即td_1)，那么代码是什么?

So suppose if someone want to hide first column i.e. td_1 from all rows, then what will be the code ?

预先感谢 戴夫

推荐答案

$(document).ready(function() {
    $("#td_1").hide();
});

但理想情况下，您想使用类而不是ID.

But ideally, you want to use a class instead of an ID.

如此

<table>
  <tr>
   <td class="td_1">name</td>
   <td class="td_2">title</td>
   <td class="td_3">desc</td>
  </tr>
  <tr>
   <td class="td_1">Dave</td>
   <td class="td_2">WEB DEV</td>
   <td class="td_3">Blah Blah</td>
  </tr>
  <tr>
   <td class="td_1">Nick</td>
   <td class="td_2">SEO</td>
   <td class="td_3">Blah Blah and blah</td>
  </tr>
</table>

然后您将使用类似的代码:

And then you would use similar code:

$(document).ready(function() {
    $(".td_1").hide()
});

因此唯一改变的是哈希(#)到点(.).哈希用于ID，点用于类.

So the only thing that changed is the hash(#) to a dot(.). Hash is for ID's, Dot is for classes.

另一种方法是使用 nthChild 选择器.

Yet another way would be to use the nthChild selector.

$(document).ready(function() {
    $('tr td:nth-child(1)').hide();
});

其中1是要隐藏的列号.

Where 1 is the column number to be hidden.

HTH

这篇关于使用jQuery隐藏表的列/td的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！