隐藏父格，如果列表为空

我有以下....隐藏父格，如果列表为空

<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

隐藏父格，如果列表为空

回答

相关问题