Question

可能重复：
hide row if it contains empty columns

这个表中包含空单元格的行是否可以使用CSS隐藏..我已经尝试过jQuery并且它现在不能正常工作.. 这就是我使用的，它没有做任何事情！

$('.EventDetail tr').each(function(){      
    if ($('td:empty',this).length > 0))
    $(this).hide();
});

这个jQuery没有什么问题，是吗？我想看看我们是否可以为所选行执行display:none？是否可以使用CSS实现？

<table cellpadding="10" class ="EventDetail">
    <tr>
        <td class="TableFields"><em>Who Should Enroll?:</em></td>
        <td>Everyone 18 and older who would like to attend</td>
    </tr>       
    <tr>
        <td class="TableFields"><em>Handicapped Access:</em></td>
        <td>Yes</td>
    </tr>
    <tr>
        <td class="TableFields"><em>Parking Notes:</em></td>
        <td></td>
    </tr>
    <tr>
        <td class="TableFields"><em>Instructor:</em></td>
        <td>John Filler</td>
    </tr>
</table>

Answer 1

这个选择器应该这样做......

$('.EventDetail tr:has(td:empty)').hide();

jsFiddle

:empty选择器会查找包含无子节点的元素。如果有可能你可能在那里有空格，但你仍然认为它是空的，尝试诸如......之类的东西。

$('.EventDetail tr').filter(function() {
    return $(this).find('td').filter(function() {
      return ! $.trim($(this).text());  
    }).length;
}).hide();

jsFiddle

如果其中一个列使用CSS为空，则隐藏表行

1 个答案: