隱藏父格，如果列表爲空

我有以下....隱藏父格，如果列表爲空

<div class="validationbox"> 
    <h1>Errors</h1> 
     <ul class="validationerrors"> 
      <li>Error 1</li> 
      <li>Error 2</li> 
      <li>Error 3</li> 
     </ul> 
</div>

錯誤列表中的項目是動態生成的所以有時候沒有，我想隱藏「validationbox」 DIV如果有沒有列表項。

我想它是JavaScript或jQuery，我應該看看，有沒有人有任何例子？

來源

2013-04-12 fightstarr20

如果（$（「＃validationerrors」）。長度> 1）{} – Darshan

在jQuery中你可以做簡單：

$(".validationbox:not(:has(li))").hide();

在純JavaScript需要迭代「.validationbox」元素，並搜索<li>節點內：

var div = document.getElementsByClassName("validationbox"); 
for (var i = 0, len = div.length; i < len; i++) { 
    if (!div[i].getElementsByTagName("li").length) { 
     div[i].style.display = "none"; 
    } 
}

來源

2013-04-12 10:05:55 VisioN

完美，感謝您的 – fightstarr20

接受的答案，如果你的作品，和它會幫助其他人。 – shabeer90

$('.validationbox').toggle($('.validationerrors li').length);

toggle()接受布爾值作爲參數。如果沒有<li>元素，則$('.validationerrors li').length將評估爲false，否則爲true，將顯示錯誤列表。

來源

2013-04-12 10:07:36 Johan

你可以不使用。

$('div .validationbox').not(':has(li)').hide();

希望這對您有所幫助

來源

2013-04-12 10:12:36

隱藏父格，如果列表爲空

回答

相關問題