jquery选择可见而不使用:visible

Question

从jquery docs中隐藏一个元素:隐藏一个祖先元素,因此该元素不会显示在页面上.

我有一个隐藏的div和内部段落,可以隐藏或可见

<div id="wrapper"> <-- this is hidden -->
    <p class="myclass" style=">display:none">text</p> 
    <p class="myclass">text</p> 
    <p class="myclass" style=">display:none">text</p> 
    <p class="myclass">text</p> 
</div>

因此任何选择$(".myclass:visible")都会失败,因为包装器是隐藏的

有没有其他方法来检查包装器中是否有可见元素并计算它们.

例如,检查元素是否具有类myclass和css display:none是我猜的一个解决方案但是我的任何尝试都失败了.

任何帮助赞赏

Answer 1

我看到的唯一方法是添加一个隐藏元素的自定义类(而不是内联样式):

.hidden {
    display: none;
}

<div id="wrapper"> <-- this is hidden -->
    <p class="myclass hidden"text</p> 
    <p class="myclass" >text</p> 
    <p class="myclass hidden">text</p> 
    <p class="myclass" >text</p> 
</div>

然后你可以用"可见"数来计算$('.myclass:not(.hidden)').length.

更新:

如果你实际上只需找到display属性不属于的元素none,.filter()就可以完成这项工作:

var count = $('.myclass').filter(function() {
    return this.style.display !== "none";    
}).length;

当然,如果某些元素display:none由您设置而不是由UI标签插件设置,则此方法无效.但在你的情况下可能就足够了.