我们需要在值为空时隐藏行。但无法获取空列值的值并进行检查。到目前为止使用的代码是
(function($) {
$('#event tr').each(function() {
if ($(this).find('.event:empty').length) $(this).remove();
});
})(jQuery);
请参阅下面的屏幕截图，标记的单元格为空，我们需要隐藏整行[{3}}
HTML结构
<table class="tribe-events-calendar" id="event">
<thead>
<tr>
<th id="tribe-events-date" class="width-print" title="date" style="width:10%">date</th>
<th id="tribe-events-date" class="width-print" title="Weekday" style="width:10%">Weekday</th>
<th id="tribe-events-date" title="holiday name" style="width:20%">holiday name</th>
<th id="tribe-events-date" title="holiday type" style="width:60%">holiday type</th>
</tr>
</thead>
<tbody>
<tr>
<td style="width:15%">
<div id="tribe-events-daynum-2-0">
2 </div>
</td>
<!-- day -->
<td style="width:15%">
Mon</td>
<!-- HOLIDAY NAME -->
<td style="width:85%" class="event">
some value
</td>
<!-- HOLIDAY Type-->
<td>
<p>National Holiday </p>
</td>
<!-- View More -->
</tr>
<tr>
<!-- Day Header -->
<td style="width:15%">
<div id="tribe-events-daynum-2-0">
2 </div>
</td>
<!-- day -->
<td style="width:15%">
Mon</td>
<!-- HOLIDAY NAME -->
<td style="width:85%" class="event">
</td>
<!-- HOLIDAY Type-->
<td>
<p>National Holiday </p>
</td>
<!-- View More -->
</tr>
</tbody>
</table>
答案 0 :(得分：3)
td包含空格，它充当textNode，因此:empty选择器不在此处工作，因为它只选择没有任何子节点的元素。
请检查文字内容并使用空格过滤td或使用filter()方法清空。
// get all `tr` within the table except the header
// to avoid header tr use tbody in selector
$('#event tbody tr').filter(function() {
// get the event column, get text content,
// trim out text and check string is empty
// 0(length) is falsy value so use `!`
return !$('.event', this).text().trim().length;
// hide the filtered element
// if you would like to remove then use remove() method
}).hide();
$('#event tbody tr').filter(function() {
return !$('.event', this).text().trim();
}).hide();<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="tribe-events-calendar" id="event">
<thead>
<tr>
<th id="tribe-events-date" class="width-print" title="date" style="width:10%">date</th>
<th id="tribe-events-date" class="width-print" title="Weekday" style="width:10%">Weekday</th>
<th id="tribe-events-date" title="holiday name" style="width:20%">holiday name</th>
<th id="tribe-events-date" title="holiday type" style="width:60%">holiday type</th>
</tr>
</thead>
<tbody>
<tr>
<td style="width:15%">
<div id="tribe-events-daynum-2-0">
2</div>
</td>
<!-- day -->
<td style="width:15%">
Mon</td>
<!-- HOLIDAY NAME -->
<td style="width:85%" class="event">
some value
</td>
<!-- HOLIDAY Type-->
<td>
<p>National Holiday</p>
</td>
<!-- View More -->
</tr>
<tr>
<!-- Day Header -->
<td style="width:15%">
<div id="tribe-events-daynum-2-0">
2</div>
</td>
<!-- day -->
<td style="width:15%">
Mon</td>
<!-- HOLIDAY NAME -->
<td style="width:85%" class="event">
</td>
<!-- HOLIDAY Type-->
<td>
<p>National Holiday</p>
</td>
<!-- View More -->
</tr>
</tbody>
</table>
答案 1 :(得分：1)
如果您的元素有空格或新行，那么：空将不会非常有效。修剪相同逻辑的空格后，可以检查html的长度。
(function($) {
$('#event tbody tr').each(function() {
if ($.trim($(this).find("td.event").html()) == "")
$(this).remove();
});
})(jQuery);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="tribe-events-calendar" id="event">
<thead>
<tr>
<th id "tribe-events-date" class="width-print" title="date" style="width:10%">date</th>
<th id="tribe-events-date" class="width-print" title="Weekday" style="width:10%">Weekday</th>
<th id="tribe-events-date" title="holiday name" style="width:20%">holiday name</th>
<th id="tribe-events-date" title="holiday type" style="width:60%">holiday type</th>
</tr>
</thead>
<tbody>
<tr>
<td style="width:15%">
<div id="tribe-events-daynum-2-0">
2</div>
</td>
<!-- day -->
<td style="width:15%">
Mon</td>
<!-- HOLIDAY NAME -->
<td style="width:85%" class="event">
some value
</td>
<!-- HOLIDAY Type-->
<td>
<p>National Holiday</p>
</td>
<!-- View More -->
</tr>
<tr>
<!-- Day Header -->
<td style="width:15%">
<div id="tribe-events-daynum-2-0">
2</div>
</td>
<!-- day -->
<td style="width:15%">
Mon</td>
<!-- HOLIDAY NAME -->
<td style="width:85%" class="event">
</td>
<!-- HOLIDAY Type-->
<td>
<p>National Holiday</p>
</td>
<!-- View More -->
</tr>
</tbody>
</table>
答案 2 :(得分：0)
很可能是空的，因为你在td中有空格。尝试
<!-- HOLIDAY NAME -->
<td style="width:85%" class="event"></td>
而不是
<!-- HOLIDAY NAME -->
<td style="width:85%" class="event">
</td>
答案 3 :(得分：0)
你可以这样做
<platform name="android">
<allow-intent href="market:*" />
<splash density="land-hdpi" src="res/screen/android/screen-hdpi-portrait.png" />
<splash density="land-ldpi" src="res/screen/android/screen-ldpi-portrait.png" />
<splash density="land-mdpi" src="res/screen/android/screen-mdpi-portrait.png" />
<splash density="land-xhdpi" src="res/screen/android/screen-xhdpi-portrait.png" />
<splash density="port-hdpi" src="res/screen/android/screen-hdpi-portrait.png" />
<splash density="port-ldpi" src="res/screen/android/screen-ldpi-portrait.png" />
<splash density="port-mdpi" src="res/screen/android/screen-mdpi-portrait.png" />
<splash density="port-xhdpi" src="res/screen/android/screen-xhdpi-portrait.png" />
<icon src="res/icons/android/logo.png" />
</platform>