在<a> is empty</a>的内容时显示容器：none

Question

我试图使用jQuery进行以下操作。

<ul><br />
<li>div>a>menu item<br />
<li>div>a>menu item<br />
<li>div>a><br />
<li>div>a>menu item<br />
</ul><br />
<br />

当a的内容>容器li是空的＆gt;需要展示无。

<br />
<ul><br />
<li>div>a>menu item<br />
<li>div>a>menu item<br />
<li class="hidden">div>a><br />
<li>div>a>menu item<br />
</ul><br />

任何人都可以帮助我吗？

Answer 1

您可以使用<a>上的:empty选择器，并使用.closest()隐藏<li>，如下所示：

$("ul a:empty").closest("li").hide();

或:has()是这样的：

$("ul li:has(a:empty)").hide();

Answer 2

将包含空li标记的所有a代码的css attibute'display'设置为'none'：

$("ul a:empty").closest("li").css('display','none');

如果您想将li的类更改为隐藏，可以使用：

$("ul a:empty").closest("li").addClass('hidden');

Answer 3

通常这将在服务器端完成，使用您使用的服务器端语言，这将授予跨浏览器支持。

Answer 4

您甚至不需要使用jQuery。

我刚刚发现这个线程正在寻找类似问题的解决方案，并且刚刚用直接CSS实现并测试了一个修复

ul a:empty {display:none !important;} 

使用当前版本的FF（22），IE（10），Chrome（30）和FWIW，Safari 5.1.7的Windows版本进行测试。

PS：这适用于任何空的css选择器。在我的所有影子框弹出窗口中使用div进行演示：http://new.3blindmiceusa.com/products/window-blinds/wood/处于空白状态。

顶部的所有图像都有href上的标题元素，这些元素在图像上显示为标题，侧栏中用于弹出联系表单的所有图标都没有标题，因此带有背景的标题div保持隐藏。 / p>

（我知道我可以将其编码为shadowbox的自定义皮肤，但除了在每张照片上添加社交分享小部件之外，我尝试不修改该代码）