只获取未隐藏的元素.Jquery

Question

我需要在jquery foreach循环中只获取show()元素

在下面的代码我得到所有元素与类测试(即)隐藏和显示...但只需要显示而不是隐藏一个...如何过滤并获得在这一行本身?????

$('.element').find('.test').each(function(index, loopelement) {

 }

Answer 1

使用:visible选择器:

$('.element').find('.test:visible').each(function(index, loopelement) {
    // do stuff...
});

Answer 2

您可以使用jQuery 的 :visible选择器。

var $visibles = $(".element").find(".test:visible");

但请注意 jQuery 的工作原理。来自 jQuery 文档：

如果元素占用了文档中的空间，则它们被视为可见。可见元素的宽度或高度大于零。

具有visibility:hidden或opacity:0的元素被认为是可见的，因为它们仍然占用布局中的空间。

如果此行为不适合您的用例，您可以扩展 jQuery，创建您自己的自定义选择器：

$.expr[":"].reallyVisible =
    function reallyVisible (elem) {
        if (elem == null || elem.tagName == null) {
            return false;
        }

        if (elem.tagName.toLowerCase() === "script" || elem.tagName.toLowerCase() === "input" && elem.type === "hidden") {
            return false;
        }

        do {
            if (!isVisible(elem)) {
                return false;
            }

            elem = elem.parentNode;
        } while (elem != null && elem.tagName.toLowerCase() !== "html");

        return true;
    };

function isVisible (elem) {
    var style = elem.style;

    // Depending on your use case
    // you could check the height/width, or if it's in the viewport...
    return !(style.display === "none" || style.opacity === "0" || style.visibility === "hidden");
}

它可以用作任何其他内置选择器：

$(".element").find(".test:reallyVisible");
$(".element").find(".test:first").is(":reallyVisible");