【问题标题】：Filter :nth-child ignoring where css display is none过滤器：nth-child 忽略 CSS 显示为无的地方
【发布时间】：2013-09-23 03:55:12
【问题描述】：

我有一个脚本，它在 3 列中获取一些浮动 div，从 1 行的 3 列中获取最大高度，并使所有 3 个 div 的高度相同。然后它对每一行重复它，脚本工作正常，但是我在 JQuery 中构建了一个自定义过滤器系统，根据价格范围或品牌等的选择隐藏或显示某些 div。

当我使用过滤器时，它将删除第一行的第 2 列，并使第二行的第 4 列向上移动到第一行。将第 2 列留在代码中，因此重新运行高度/列检查脚本将不起作用。

所以我要做的是在我使用 filter(':nth-child(3n-2)') 的地方添加一个 if 语句，该语句将跳过从 :nth-child 选择中隐藏的所有 div。

我知道我可以在filter(); 中使用一个函数，但它对我来说是新的，所以我不确定如何准确地使用它。

这是我的工作代码：

var $sections = $('.section-link');
$sections.filter(':nth-child(3n-2)').each(function () {
    var $this = $(this),
        $els = $this.nextAll(':lt(2)').addBack();
    var sectionheight = new Array();
    $els.each(function () {
        var value = $(this).find('.section-title').height();
        sectionheight.push(value);
    });
    var newsectionheight = Math.max.apply(Math, sectionheight);
    $els.find('.section-title').height(newsectionheight);
})

JSfiddle example

到目前为止，我正在尝试使用这样的东西：

$sections.filter(function() {
   return $(this).css('display') !== 'none';
}, ':nth-child(3n-2)')

【问题讨论】：

标签： javascript jquery

【解决方案1】：

好的，通过在调用 :nth-child 之前返回 css 属性来让它工作

function makeheight(){
var $sections = $('.section-link');

    $sections.filter(function() {
   return $(this).css('display') == 'block';
}, ':nth-child(3n-2)').each(function () {

        var $this = $(this),
            $els = $this.nextAll(':lt(2)').addBack();
        var sectionheight = new Array();
        $els.each(function () {
            var value = $(this).find('.section-title').height();
            sectionheight.push(value);
        });
        var newsectionheight = Math.max.apply(Math, sectionheight);
        $els.find('.section-title').height(newsectionheight);
    });


}

【讨论】：