0

我得到了以下重复的语法，我想保留所有<h1>后面的至少一个不隐藏的 div，但删除剩余的孤儿<h1>：

<h1>FIRST</h1>
<div></div>
<div></div>

<h1>SECOND</h1>
<div style="display:none"></div>
<div></div>

<h1>THIRD</h1>
<div style="display:none"></div>
<div style="display:none"></div>

<h1>FOURTH</h1>
<div></div>
<div></div>

如您所见，有时在 div 之前有一个<h1>未隐藏的 div。所以在第三块我想隐藏<h1>，但不是在第二块或任何其他块中。

我尝试的基本上是寻找一种情况，即 an<h1>后面跟着另一个<h1>，而忽略了两者之间的所有隐藏元素：

$('h1').each(function(){
    if($(this).nextAll().not(':hidden') == $('h1')) { $(this).hide() }
})

不幸的是，它不会隐藏任何，<h1>我只是不知道为什么，尽管我怀疑这个:hidden属性是问题所在。应该注意的是，在我的真实代码中，隐藏<div>不是由'display：none'隐藏，而是通过使用jQuerys .hide()！

希望有人能帮忙。

4

3 回答 3

2

这就是你所追求的吗？

对于每一个H1，找到下一个H1之前的所有元素，如果都被隐藏了，就隐藏这个H1

$('h1').each(function() {
var elems = $(this).nextUntil('h1');
var elemsHidden = false;
for (var i = 0; i < elems.length; i++) {
    if ($(elems[i]).is(':hidden')) {
        elemsHidden = true;
    } else {
        elemsHidden = false;
    }
}

if (elemsHidden) {
    $(this).hide();
}

});​

更新

$('h1').each(function() {
    var elems = $(this).nextUntil('h1');
    for (var i = 0; i < elems.length; i++) {
        if (!$(elems[i]).is(':hidden')) {
            return;
        }
    }        
    $(this).hide();

});​

JSFiddle
http://jsfiddle.net/Mm6Mz/1/

更新 2 

$('h1').each(function() {
    $(this).nextUntil('h1').is(':visible') ? 0 : $(this).hide() ;
});​

JSFiddle
http://jsfiddle.net/Mm6Mz/2/

于 2012-06-14T22:45:27.987 回答
1

我能想到的最干净的解决方案：

$('h1').each(function(){
  if ( $(this).nextUntil('h1').not(':hidden').length == 0 ) $(this).hide();
});​

这里的例子：http: //jsfiddle.net/sagivo/sTveD/

于 2012-06-14T22:42:54.430 回答
0

您可以选择 hiddendiv然后找到 prev h1。它减少了您的代码并使其保持简单

$('div:hidden').prev('h1').hide();

jsfiddle在这里http://jsfiddle.net/tkYbh/

于 2012-06-14T22:56:15.207 回答