CSSを使用してその列の1つが空の場合はテーブルの行を隠す[重複]

Question

可能な重複：
空の列が含まれていれば行を非表示にする

このテーブルの空のセルを含む行はCSSを使用して隠されています。 これは私が使ったもので、何もしません！

$('.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 。