重复结果无限滚动API PHP

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (1)
  • 关注 (0)
  • 查看 (102)

我正在使用php和api进行无限的ajax滚动,但我的数据正在重复。我不想在用户结束页面时加载数据(完美运行)。当用户到达某个div(check_onload)然后加载数据时我想要的是什么,但在这种情况下数据正在重复。这是我的代码下面我停止重复数据的方法。

<div id="post-data"></div>
<div style="display:none;" class="ajax-load"></div>
<div class="check_onload"></div>




<script type="text/javascript">

///this run Perfectly
 $(window).scroll(function() {
        if($(window).scrollTop() + $(window).height() >= $(document).height()) {
            var token = $(".tokenId").val();
            GetMoreData(token);
        }
    });



    ///Repeating or duplication the data
   $(window).on('scroll',function() {
        if (checkVisible($('#check_onload'))) {
            var token = $(".tokenId").val();
            GetMoreData(token);

        } else {

        }
    });

    function checkVisible( elm, eval ) {
        eval = eval || "object visible";
        var viewportHeight = $(window).height(), // Viewport Height
            scrolltop = $(window).scrollTop(), // Scroll Top
            y = $(elm).offset().top,
            elementHeight = $(elm).height();

        if (eval == "object visible") return ((y < (viewportHeight + scrolltop)) && (y > (scrolltop - elementHeight)));
        if (eval == "above") return ((y < (viewportHeight + scrolltop)));
    }


   function GetMoreData(token){
      $.ajax(
            {
                url: '/loadMoreData.php?token=' + token,
                type: "get",
                beforeSend: function()
                {
                    $('.ajax-load').show();
                }
            })
            .done(function(data)
            {
                $('.ajax-load').hide();
                $("#post-data").append(data.html);
                $("#tokenId").val(data.token);
            })
            .fail(function(jqXHR, ajaxOptions, thrownError)
            {
                  alert('server not responding...');
            });
    }
</script>
提问于
用户回答回答于

您有2个窗口滚动事件被触发,导致重复,因为每次用户滚动页面时,您使用相同的令牌从服务器请求数据两次。我将不得不假设删除其中一个将解决您的问题。

没有看到您的服务器代码,这是唯一的解决方案。

扫码关注云+社区

领取腾讯云代金券