jQuery   发布时间:2022-04-19  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了jQuery无限滚动 – 滚动快速时多次触发大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
好的,下面的代码“工作”,当你滚动到页面底部,AJAX函数被触发,结果附加到页面上的#postswrapper div。

问题是:如果我在页面底部快速滚动,AJAX会触发几次,并将多组结果加载到#postswrapper div中(附加的“不需要的”数量)由多少额外的滚动确定事件被快速滚动触发)。

最终,我只需要在每次用户到达底部时提供一组结果。我已经尝试添加计时器等等,但没有效果。显然,在DOM中存储额外的滚动操作,然后按顺序触发它们。

有任何想法吗?

我正在使用jquery.1.4.4.js,如果这有助于任何人。而在这种情况下,e.preventDefault()不起作用。

$(window).scroll(function(E) {
    e.preventDefault();
    if ($(window).scrollTop() >= ($(document).height() - $(window).height())) {
        $('div#loadmoreajaxloader').show();
        $.ajax({
            cache: false,url: 'loadmore.PHP?lastid=' + $('.postitem:last').attr('id'),success: function(html) {
                if (html) {
                    $('#postswrapper').append(html);
                    $('div#loadmoreajaxloader').hide();
                } else {
                    $('div#loadmoreajaxloader').html();
                }
            }
        });
    }
});
@H_673_13@解决方法
尝试存储一些存储页面是否正在加载新项目的数据。也许这样:
$(window).data('ajaxready',truE).scroll(function(E) {
    if ($(window).data('ajaxready') == falsE) return;

    if ($(window).scrollTop() >= ($(document).height() - $(window).height())) {
        $('div#loadmoreajaxloader').show();
        $(window).data('ajaxready',falsE);
        $.ajax({
            cache: false,success: function(html) {
                if (html) {
                    $('#postswrapper').append(html);
                    $('div#loadmoreajaxloader').hide();
                } else {
                    $('div#loadmoreajaxloader').html();
                }
                $(window).data('ajaxready',truE);
            }
        });
    }
});

在发送Ajax请求之前,将清除一个标志,表示文档尚未准备好进行更多Ajax请求。一旦Ajax成功完成,它将标志设置为true,并且可以触发更多的请求。

大佬总结

以上是大佬教程为你收集整理的jQuery无限滚动 – 滚动快速时多次触发全部内容,希望文章能够帮你解决jQuery无限滚动 – 滚动快速时多次触发所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。