如果内容为空，则隐藏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 。

Answer 2

var myDiv =  $('#myDiv');

if (myDiv.text() == '')
{
    myDiv.hide();
}

Answer 3

就像是：

if ($('.philosophy-bubble').is(":empty")){
    $('.philosophy-bubble').hide();
}

这是一个小提琴： http ： //jsfiddle.net/IrvinDominin/XYr9T/1/

编辑

更好地使用：

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

http://jsfiddle.net/IrvinDominin/XYr9T/3/