单独检查div中所有元素的条件

时间:2016-07-31 05:00:13

标签: javascript jquery

我有一个类'container'的div,其中有许多div,类为'children'。我想在'children' div滚动到视图时对其进行操作。

我尝试过使用它。

$('.container .children').each(function(){
    var element = this;
    if(functionToCheckVisibility($(element))){
        //my code
    }
});

但它没有做出改变。

我怎样才能做到这一点?

3 个答案:

答案 0 :(得分:1)

尝试使用<div id="wrapper"> <div id="left"> One: <p> <button onclick="plus" id="6">plus</button> <p> <button onclick="minus" id="7">minus</button></div> <div id="right"> Two <p> <button onclick="plus2" id="6">plus</button> <p> <button onclick="minus2" id="7">minus</button></div> </div>

$el.is(':visible')

如果“可见”是指“当前在屏幕上可见”,我会使用this library。否则,上面的代码应该可以正常工作。

答案 1 :(得分:0)

尝试使用函数children

$('.container').children('children').each(function(){
    var element = this;
    if(functionToCheckVisibility($(element))){
        //my code
    }
});

答案 2 :(得分:0)

这应该这样做:https://jsfiddle.net/0d8poebr/1/

$('.container .children').each(function(idx, el){
   if ($(el).is(':visible') && isScrolledIntoView(el)) {
        $(el).html('I am visible')
    }
});

function isScrolledIntoView(elem)
{
    var containerTop = $('.container').offset().top;
    var containerBottom = containerTop + $('.container').height();

    var elemTop = $(elem).offset().top;
    var elemBottom = elemTop + $(elem).height();

    return ((elemBottom <= containerBottom) && (elemTop >= containerTop));
}