0

我有一张这样的桌子：

<table Id="modules-mgr">
<tbody>
<tr>
<td>lorem ispium blok</td>
<td>lorem ispium blok</td>
<td>lorem ispium blok</td>
</tr>
<tr>
<td>lorem ispium blok</td>
<td>lorem ispium blok</td>
<td>lorem ispium blok</td>
</tr>
<tr>
<td>lorem ispium blok</td>
<td>lorem ispium blok</td>
<td>lorem ispium blok</td>
</tr>
</tbody>
</table>

我想td从每个tr. 和 没有任何类td，tr因此我们需要使用 选择它们.eq。并且还想要一个 else if 函数，比如 resize 事件。如果窗口大小调整为 200，则最后隐藏td，如果窗口大小调整为 100，则隐藏最后两个td。到目前为止，我所做的一切都在这里，但确实有效；

jQuery(window).resize(function() {
var width=jQuery(window).width();
    if(width < 870) {
        jQuery('table#modules-mgr tr td').eq(10).hide()

    }
    /*elseif(width < 570) {

    }
    else {

    }*/
});
4

4 回答 4

3

仅 CSS：

@media all and (max-width: 200px) {
    #modules-mgr td:last-child {display:none]
}
@media all and (max-width: 100px) {
    #modules-mgr td:nth-last-child(-n+2) {display:none]
}
于 2012-10-05T12:25:35.457 回答
1

好吧，如果你真的想要 nth-child 就像标题中所说的那样，

jQuery('#modules-mgr td:nth-child(10)').hide();

对于那些没有陷入黑暗时代的浏览器，应该像在直接 CSS 中那样做：

#modules-mgr td:nth-child(10) {
    display: none;
}

（如果您只想要最后一个元素，请参阅其他答案）

于 2012-10-05T12:28:00.900 回答
0

如果要隐藏最后一个，可以使用last()选择器：

// for last
$('#modules-mgr tr td').last().hide();
// for n-th element - 0-index based
$('#modules-mgr tr td').eq(n - 1).hide();

选择：

// for last
$('#modules-mgr tr td:last').hide();
// for n-th element - 0-index based
$('#modules-mgr tr td:eq(n - 1)').hide();
于 2012-10-05T12:26:04.537 回答
0 
jQuery('table#modules-mgr tr td').last().hide();
于 2012-10-05T12:27:26.457 回答