如何隱藏panel-body爲空？

Question

我想隱藏panel-body，如果它是空的。

這裏的例子：BootPly

編寫JavaScript代碼：

$(function() { 
    $('#container').load(function() { 
     if($.trim($(this).contents().find("container").find('panel-body').length) == 0) { 
      $(this).hide(); 
     } 
    }); 

代碼HTML：

<div class="container"> 
    <div class="row clearfix"> 
     <div class="col-md-9 column"> 
      <div class="panel panel-primary"> 
       <div class="panel-heading">Content</div> 
       <div class="panel-body fixed-panel"> 
        <div class="form-group"> 

        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

Answer 1

怎麼這樣呢？ http://www.bootply.com/bKb0isdzKA

$(function() { 
    $('.form-group').each(function() { 
     if ($(this).is(':empty')) { 
      $(this).closest('.container').hide(); 
     } 
    }); 
}); 

您有幾個問題。首先，您使用的是#container作爲您的選擇器，儘管container是類別。此外，您正在檢查body-panel是否爲空，但它包含一個子div，因此它始終具有HTML內容。

上面的代碼將遍歷每個.form-group並隱藏父容器，如果它是空的。

如果這不符合您的想法，請告訴我，我可以進行調整。