Question

我有jQuery Function Scroll。当我将滚动放在底部然后刷新页面时，它将加载数据重复。

请参阅下面的JS：

var track_load = 0;
var loading  = false;
var total_groups = <?php echo $total_groups; ?>;

$('#content').load("../load_post_photo.php", {'group_no':track_load,'q_uid':'<?php echo $q_uid; ?>'}, function() {track_load++; $('.animation_image').hide();});

$(window).scroll(function()
{
    if($(window).scrollTop() + $(window).height() == $(document).height())
    {
        if(track_load < total_groups && loading==false)
        {
            loading = true;
            $('.animation_image').show();

            $.post('../load_post_photo.php',{'group_no':track_load,'q_uid':'<?php echo $q_uid; ?>'}, function(data){

            $("#content").append(data);
            load = 1;
            $('.animation_image').hide();

            track_load++;
            loading = false; 

    }).fail(function(xhr, ajaxOptions, thrownError)
    {
        $('.animation_image').hide();
        loading = false;
    });
}
}
});

Answer 1

您在此处执行的操作会在初始页面加载时发生异步.load，然后再次将.post绑定到滚动事件。

回答你的问题，为什么当你把它移到底部＆＃34;它加载两次，这很可能是由于您将代码放在头部的位置引起的。如果jQuery还没有加载，那JS就会第一次出错（检查控制台）。但是，当您将代码移动到底部＆＃34; （最有可能在引用jQuery之后）.load的初始异步调用正在运行。

现在...

你真的应该重新考虑你为滚动设置事件的方式。如果您继续使用该方法来确定何时发布您正在处理的任何数据，则应考虑使用throttling。

有关限制的示例，请在您喜爱的浏览器开发人员工具中启动您的控制台并检查此问题：http://jsfiddle.net/81579thy/。真正重要的代码如下。

var myFunc = _.throttle( function () {
    // body of my function
}, 750 );

此示例使用lodash实现的throttle方法（链接到上面）。这样做本质上是接受你给它的功能，并返回一个新的，只会在毫秒后执行＆＃34;等待＆＃34;你传递的计时器作为第二个参数。

如果你按照小提琴的链接打开你的控制台，你会看到日志来自调用限制函数的位置比实际调用的更多。

jQuery Scroll，滚动到底部时始终显示重复数据

1 个答案: