Question

在此fiddle中，它只能检测到一个DOM元素。如果我有多个需要检测的元素，例如fiddle。它将忽略第二个div标记。

有谁知道如何将div中的多个viewbag元素传递给此函数？

$.fn.is_on_screen = function () {

    var win = $(window);

    var viewport = {
        top: win.scrollTop(),
        left: win.scrollLeft()
    };
    viewport.right = viewport.left + win.width();
    viewport.bottom = viewport.top + win.height();

    var bounds = this.offset();
    bounds.right = bounds.left + this.outerWidth();
    bounds.bottom = bounds.top + this.outerHeight();

    return (!(viewport.right < bounds.left || viewport.left > bounds.right || viewport.bottom < bounds.top || viewport.top > bounds.bottom));

    if ($('.target').is_on_screen()) {
        alert('hey');
    }

};

Answer 1

这是因为当你调用$('.target').is_on_screen()时，只考虑数组中的第一个元素，这是第一个带有类target的DOM元素

要解决这个问题，请写下：

function isTargetVisble() {
    var retunVal = false;
    $('.target').each(function() {
        if( $(this).is_on_screen() ) {
            retunVal = true;
        }
    });
    return retunVal;
}

并使用它

if( isTargetVisble() ) { // if target element is visible on screen after DOM loaded

而不是

if( $('.target').is_on_screen() ) { // if target element is visible on screen after DOM loaded

工作JSFiddle

在视口中检测多个div元素

1 个答案: