내용이없는 경우 DIV를 숨기는 방법

Question

Ektron CMS에서 자동 생성 한 내용이있는 DIV가 있습니다. 소스의

스크린 샷 :

출력 :

DIV에 클래스 justPad 한 번 이상 나타나지 않는 경우 각각의 부모 DIV ({letter}Serv가) 비어 있습니다. 따라서 스크린 샷을 기반으로하면 A와 C에는 콘텐츠가 있지만 B와 D에는 콘텐츠가 없습니다.

{letter}Serv DIV 안에 콘텐츠가 없으면 어떻게 숨길 수 있습니까?

은 내가 적용 할 수있는 다음과 같은 클래스가 :

.hideDiv { 
    display: none; 
} 

샘플 코드 :

<div id="nServ" class="serviceHolder hidOverflow percPadBottom letterCode"> 
    <h2 class="defaultBlue percPadBottom">N</h2> 
     <span id="ctl00_BodyPlaceHolder_Collection15"> 
     <a href="#ViewEditorsMenu" data-ektron-editorsmenu-id="EktronEditorsMenu3c275505-4a2c-4384-bf36-081bc3e69279" onclick="return false;" class="EktronEditorsMenuMarker"><img src="/WorkArea/images/application/pin_grey.gif" alt="Editor's Menu" title="Editor's Menu" /></a> 
     <ul id="EktronEditorsMenu3c275505-4a2c-4384-bf36-081bc3e69279" class="EktronEditorsMenu" style="display:none;"> 
      {CONTENTS} 
     </ul> 
     <div class="justPad"><a class="defaultLinks" href="link">Nephrology</a></div> 
     <div class="justPad"><a class="defaultLinks" href="link">Neurology</a></div> 
     <div class="justPad"><a class="defaultLinks" href="link">Nutrition</a></div> 
    </span> 
</div> 

<div id="bServ" class="serviceHolder hidOverflow percPadBottom letterCode"> 
    <h2 class="defaultBlue percPadBottom">B</h2> 
     <span id="ctl00_BodyPlaceHolder_Collection15"> 
     <a href="#ViewEditorsMenu" data-ektron-editorsmenu-id="EktronEditorsMenu3c275505-4a2c-4384-bf36-081bc3e69279" onclick="return false;" class="EktronEditorsMenuMarker"><img src="/WorkArea/images/application/pin_grey.gif" alt="Editor's Menu" title="Editor's Menu" /></a> 
     <ul id="EktronEditorsMenu3c275505-4a2c-4384-bf36-081bc3e69279" class="EktronEditorsMenu" style="display:none;"> 
      {CONTENTS} 
     </ul> 
    </span> 
</div> 

Answer 1

이렇게하면 모든 빈 Div를 찾아 숨길 수 있습니다.

$('div.serviceHolder:not(:has(div.justPad))').hide() 

Answer 2

각 사업부를 통해 반복하고, 어린이 길이 보이는 경우는 null .hide() 사업부 :

$('.hidOverflow').each(function() { 
    var $this = $(this), 
     $items = $this.children('.justPad'), 
     itemAmount = $items.length; 

    if(itemAmount <= 0) { 
     $this.hide(); 
     // or if you want to use your CSS-class 
     $this.addClass('hideDiv'); 
    } 
}); 

편집 : .hide() 기능 대신 CSS 클래스를 사용하는 버전이 추가되었습니다.

Answer 3

는 .... 다음

$(document).ready(function(){ 
$("div[id$=Serv]").each(function(){ 
     if($(this).is(':empty')){ 
      $(this).hide(); 
     } 
     else{ 
      $(this).show(); 
     } 
}); 
}); 

는 희망이 도움이