Jquery:如果有任何.siblings()。position()。top等于$(this).position()。top

时间:2014-08-13 03:45:47

标签: javascript jquery position each siblings

我有以下html:

<div class="container" id="1"></div>
<div class="container" id="2"></div>
<div class="container" id="3"></div>

<div class="details" id="1"></div>
<div class="details" id="2"></div>
<div class="details" id="3"></div>

和jQuery:

$(document).ready(function () {
        $('.container').each(function () {
            $(this).click(function () {
                var elem = $(this),
                    containerId = elem.attr('id'),
                    activeId = $(containerId + '.active');
                $(this).toggleClass('active').siblings().removeClass('active');
                $('#details-' + containerId).toggleClass('visible').siblings().removeClass('visible');
            });
    });
});

我要做的是查看是否有任何其他.container div与活动容器(我刚刚点击的那个)具有相同的位置。如果它们没有相同的顶部位置,那么我将它们向下滑动并以全宽显示细节。

所以我认为这样的事情应该有用 - $(this)意思是活跃的.container div:

if($(this).siblings().position().top == $(this).position().top) {
// add some class to EACH sibling that has equal top position
}

但我不完全确定如何做到这一点。任何帮助将不胜感激!

1 个答案:

答案 0 :(得分:0)

你需要像

这样的东西
var top = $(this).position().top;

var $sibs = $(this).siblings().filter(function(){
    return $(this).position().top == top
})
//do something with the matching siblings refferred by $sibs

$(this).siblings().position().top将返回第一个兄弟元素的top值,它不会检查其余兄弟姐妹的值。