使用jQuery，如何只找到可见元素并单独留下隐藏元素？ [英] Using jQuery, how do you find only visible elements and leave hidden elements alone?

问题描述

所以我从第1-4项开始：

So I start with items 1-4:

<div class="someDiv bold italic" style="display: none;">Lorem</div>
<div class="someDiv regular italic" style="display: block;">Lorem</div>
<div class="someDiv bold" style="display: none;">Ipsum</div>
<div class="someDiv regular" style="display: block;">Ipsum</div>

然后我有一些输入复选框：

Then I have some input checkboxes:

<input class="regular" type="checkbox" />
<input class="bold" type="checkbox" />
<input class="italic" type="checkbox" />

所以基本上我有jQuery显示和隐藏div。现在我有另一个必须遍历这些div的函数（每个复选框一个），并根据另一个标准显示/隐藏。但我不希望再次显示已经隐藏的div。

So basically I have jQuery showing and hiding divs. Now I have another function that must iterate through these divs (one for each checkbox), and show/hide based on another criteria. But I don't want the already hidden divs to be shown again.

$(".someDiv").each(function(){
  if($(this).hasClass("regular")){
    $(this).show();
  } else {
    $(this).hide();
  };

在这个例子中，唯一剩下的div应该是最后一个div。不幸的是，这段代码会显示第二个和第四个div。

In this example, the only remaining div should be the last div. Unfortunately, this code will make the second and fourth divs shown.

这段代码是我要申请的所有过滤器的基本示例，添加等。

This code is very basic example of all the filters I'm going to be applying, adding etc.

推荐答案

您可以使用：可见选择器仅查找可见。

You can use the :visible selector to find only visible.

$(".someDiv:visible").each(....);

你可以使用。not（）选择器只能查找隐藏。

You can use the .not() selector to find only hidden.

$(".someDiv").not(":visible").each(....);

<我认为你可以表演在你的代码中使用这一行进行相同的操作。

I think you can perform the same operation in your code with this one line.

$(".someDiv").hide().find(".regular").show();

查找所有 .someDiv 并隐藏它们，然后找到那些带有 .regular 类并显示它们。

Find all .someDiv and hide them, then find those with a .regular class and show them.

这篇关于使用jQuery，如何只找到可见元素并单独留下隐藏元素？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！