zoukankan      html  css  js  c++  java
  • 滚动加载

    window(可以是其他的容器元素)上监听滚定事件,当特定的元素滚入可视区域之后触发ajax加载更多数据,触发过后就不再重复触发了,所以要移除标记。这里的一个关于元素滚动进入视窗的判断原理如下:元素到容器顶端的距离 - 窗口的高度 = 元素进入视窗需要滚动的距离,用这个距离和容器滚动距离比较就能判断是否进入视窗。

    $(element).offset().top - $(container).height() < $(container).scrollTop

        $(function  () {
            $(window).on('scroll',function  () {
                var containerScroll=$(this).scrollTop()
                $(".scroll").each(function  () {
                    var subtract = $(this).offset().top-$(window).height();
                    if(containerScroll > subtract)
                    {   
                        console.log('loading: ',1111);
                        $(this).removeClass('scroll');
                        $.ajax({
                            url:'/search',
                            method:'POST',
                            dataType:'json',
                            data: {action:'search', page:1},
                            success:successCallback,
                            error:function (resp){
                                console.log('XXXX: ',resp)
                            }
                        });
                    }
                })
            })
        });
    
  • 相关阅读:
    Chisel3
    Chisel3
    Chisel3
    Chisel3
    Chisel3
    Chisel3
    Chisel3
    Chisel3
    Chisel3
    UVa 12716 (GCD == XOR) GCD XOR
  • 原文地址:https://www.cnblogs.com/wancy86/p/scrollLoading.html
Copyright © 2011-2022 走看看