我有一个表,我想通过简单地将一个名为'masked'的类应用于标题col来隐藏整列(3rth >> head + body):
<table>
<thead>
<th>aaa</th>
<th class="masked">bbb</th>
<th class="masked">ccc</th>
</thead>
<tbody>
<tr>
<td>a1</td>
<td>b1</td>
<td>c1</td>
</tr>
<tr>
<td>a2</td>
<td>b2</td>
<td>c2</td>
</tr>
<tr>
<td>a3</td>
<td>b3</td>
<td>c3</td>
</tr>
</tbody>
CSS:
.masked {
display:none;
}
此时,仅遮掩标题col。如何掩盖整个列?
在此处查看演示:http://jsbin.com/axukob/1/
谢谢。
编辑---------------------
我可以使用jQuery解决方案,因为仅CSS似乎很难。但是对我来说,重要的是使班级添加到标题“ th”中。
请注意,我可能要遮盖1列以上。
最佳答案
由于您愿意使用JS(必须使用),因此可以执行以下操作:
示例:http://jsfiddle.net/mBhB3/1/
$(document).ready(function() {
var masked = $('.masked');
$.each(masked, function() {
var idx = $(this).index();
$.each($('tr'), function() {
$(this).find('td').eq(idx).hide();
});
});
});