jQuery：'可见'是否检测到最初隐藏的元素？

我有一些HTML标记是这样的：jQuery：'可见'是否检测到最初隐藏的元素？

<div class="item first">First Item</div> 
<div class="item second">Second Item</div> 
<div class="item third">Third Item</div> 
<div class="item fourth">Fourth Item</div>  
<div class="item fifth">Fifth Item</div> 
<div class="item sixth">Sixth Item</div> 
<div class="item seventh" style="display: none;">Seventh Item</div> 
<div class="item eighth" style="display: none;">Eighth Item</div></div> 

<div class="button"></div>

你会发现，前6类是可见的，但最后2班有显示：无风格。

这是因为我让用户将两个项目替换为两个其他项目，如果他们选择这样做。下面是非常简化的伪代码，但我并不担心，因为它的工作原理 - 我只是想给你一个什么样的想法是怎么回事：

$('.item').click(function(){ 
    var thisClass = $(this).attr('class'); 
    $('.' + thisClass).fadeOut(); 
    $('.seventh').fadeIn(); 
});

现在我们正在向真正的问题：

我总是在页面上有六个可见的项目（一些开始隐藏，一些开始可见）。我一直在做这样的事情：

$('.button').click(function(){ 
    $('#id').find('.class:visible').each(function() { 
     //do something 
    }) 
});

然而，“每个”从来没有发现被隐藏在页面加载的申报单，即使他们可能是通过按钮点击事件发生的时间可见。

我可以用计数器来验证。假设我取消了两个div并隐藏了两个div。我总共有6个可见的div，所以我期望得到6个结果 - 但是在该特定情况下，该计数器永远不会高于4，并且它永远不会将最初隐藏的div的类返回给我。

有关我可以做什么改变的想法吗？

tldr; $('#id').find('.class:visible')只发现在页面加载中可见的div，并忽略曾经隐藏但现在可见的div。

来源

2015-09-23 Duplosion

由于dom搜索不会发生，直到按钮单击没有理由，他们不应该被发现，除非该类被删除或元素被移动。所描述的症状根据所显示的信息是没有意义的......需要一个复制问题的演示 – charlietfl

_“但是，它永远不会”看到“页面载入时隐藏的div，即使它们可能在按钮点击事件发生“_？不一定正确解释问题？如果单击按钮发生时可见元素，为什么元素将作为隐藏元素返回？ – guest271314

只是讨论问题 - 'var thisClass = $（this）.attr（'class'）; $（'。'+ thisClass）.fadeOut（）;'而不是这只是'$（this）.fadeOut（）'？ –

我想你在找什么是显示6个项目的时候，也让当用户删除现有2项为2个隐藏项目，

var counter = 0; 
 
$('.item').one('click.limit', function() { 
 
    $(this).fadeOut(); 
 
    $('.item:hidden:first').fadeIn(); 
 
    if (++counter == 2) { 
 
    $('.item').off('click.limit') 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    <div class="item first">First Item</div> 
 
    <div class="item second">Second Item</div> 
 
    <div class="item third">Third Item</div> 
 
    <div class="item fourth">Fourth Item</div> 
 
    <div class="item fifth">Fifth Item</div> 
 
    <div class="item sixth">Sixth Item</div> 
 
    <div class="item seventh" style="display: none;">Seventh Item</div> 
 
    <div class="item eighth" style="display: none;">Eighth Item</div> 
 
</div> 
 
<div class="button"></div>

来源

2015-09-23 03:45:51

答案是......

我是个白痴。在最初隐藏的div上，我没有注意到类名中有一个空格。虽然

叹息

感谢您的帮助，大家好。

来源

2015-09-23 04:15:17 Duplosion

jQuery：'可见'是否检测到最初隐藏的元素？

回答

相关问题