Question

当我向下滚动页面时，如何每1000 px自动执行一次JS函数？

如果用户向下滚动小于1000像素，然后向上滚动相同数量，则不会发生任何事情。

这是我想要执行的函数的调用：

    refresh('refresh_status', 'refresh_status.php', '', '', '', 'refresh');

Answer 1

我假设你不想使用jQuery，因为最初的post标签只是javascript。

这是根据滚动事件检测当前高度的代码，它也是跨平台的：

function getScrollTop(){
    if(typeof pageYOffset!= 'undefined'){
        //most browsers except IE before #9
        return pageYOffset;
    }
    else{
        var docBody = document.body; //IE 'quirks'
        var docElement= document.documentElement; //IE with doctype
        docElement = (docElement.clientHeight)? docElement : docBody ;
        return docElement.scrollTop;
    }
}

window.onscroll = function (oEvent) {
    var currentScrollTop = getScrollTop(); // current position in pixels from top
    // do whatever you want here at the pixel height which you desire
}

Answer 2

您可以相对轻松地使用jQuery执行此操作。

$(window).scroll( function(){
    var count = 1;
    var windowPosition = $(window).scrollTop();
    if( windowPosition === count*1000 ){
        myFunction();
        count++;
        };
});

Answer 3

使用jQuery很容易！

var win = $(window),
    sectionHeight = 1000,
    currentSection = 0,
    $result = $('#result');

function myFunction(n) {
    $result.append('<p>FUNCTION CALLED ' + n + '</p>')
}

win.scroll(function (e) {
    var calculateSection = parseInt(win.scrollTop() / sectionHeight, 10);
    if (currentSection !== calculateSection) {
        currentSection = calculateSection;
        myFunction(currentSection);
    }
});

这是一个小提琴！

http://jsfiddle.net/sidonaldson/KsNcz/1/

如何在向下滚动页面时每1000px加载一个JS函数？

3 个答案: