Javascript滚动到底,生成重复的请求

Javascript scroll to bottom generating duplicate requests

本文关键字:请求 滚动 Javascript      更新时间:2023-09-26

我有以下javascript代码用于创建一种无限滚动UI。问题是当我用鼠标滚轮滚动时,它会产生几个请求。

样品HERE

var canLoad = true;
$(window).scroll(function()
{ 
    if($(window).scrollTop() == $(document).height() - $(window).height() && canLoad)
    {
    canLoad = false;
            $('div#loadmoreajaxloader').show();
        $.ajax({
        url: "/loadmore.html",
        success: function(html)
        {
            if(html)
            {
            var $html = $(html);
            $html.imagesLoaded(function() {
                $('div#loadmoreajaxloader').hide();
                $("#container").masonry('appended', $html, true);
            }).appendTo($("#container"));
            }else
            {
                $('div#loadmoreajaxloader').html('<center>No more backgrounds to show.</center>');
            }
        }
        });
        canLoad = true;
    }
});

您的最佳选择是在scroll函数中使用计时器,并在每次请求之前取消它:

var timer;
$(window).scroll(function()
{
    timer && clearTimeout(timer);
    timer = setTimeout(function()
    {
        // Run whatever code you want here...
    }, 300);
});

小提琴在这儿:http://jsfiddle.net/FcxSL/

我看错了你的问题,

以下是你需要做的,当您在中ajax内容时,请确保为一个ajaxeddiv提供一个id。然后你放一个if语句

检查该元素是否存在,如果存在,它将不会再次执行post请求,如果不在dom中,它将执行请求。