如果内容为空,则隐藏div

Question

哲学泡沫就像一个引用/语音泡沫div样式,内部有一个sharepoint控件,richHtmlField允许用户在编辑页面时输入内容,但如果用户选择将其留空,则div中没有​​内容只有气泡会出现在页面中看起来很有趣所以我想在没有用户输入或基本上div是空的时候隐藏整个div？你是如何在jquery中做到这一点的？

<div class="philosophy-bubble">
<PublishingWebControls:RichHtmlField FieldName="carephilosophy" runat="server"></PublishingWebControls:RichHtmlField>
</div>  

Answer 1

使用jQuery的:empty选择器:

$('.philosophy-bubble:empty').hide();

这是一个工作小提琴.

替代

您还可以使用该filter()函数查找所有空div并隐藏:

//All divs
$('div').filter(function() {
        return $.trim($(this).text()) === ''
}).hide()

//div's with a certain class
$('.philosophy-bubble').filter(function() {
        return $.trim($(this).text()) === ''
}).hide()

//div with a specific ID
$('#YourDivID').filter(function() {
        return $.trim($(this).text()) === ''
}).hide()

..等等.

注:该:empty选择会更好的性能.见jsPerf.