zoukankan      html  css  js  c++  java
  • 手机web下拉加载

    //需要 zepto.js支持
        var page=0;//当前页
        var pages=1;//总页数
        var ajax=!1;//是否加载中
        Zepto(function($){
            $(window).scroll(function(){
                if(($(window).scrollTop() + $(window).height() > $(document).height()-40) && !ajax && pages > page){
                    //滚动条拉到离底40像素内,而且没ajax中,而且没超过总页数
                    //json_ajax(cla,++page);
                    page++;//当前页增加1
                    ajax=!0;//注明开始ajax加载中
                    $(".list").append('<div class="loading"><img src="/template/mobile/loading.gif" alt="" /></div> ');//出现加载图片
                    $.ajax({
                        type: 'GET',
                        url: './json.php?page='+page+'&'+Math.random(),
                        dataType: 'json',
                        success: function(json){
                            pages=json.pages;//更新总页数
                            page=json.page;//更新当前页(js不太可靠)
                            for(var i= 0,l = list.length;i<l;i++){
                                //处理数据并插入
                            }
                            $(".loading").remove();//删除加载图片
                            ajax=!1;//注明已经完成ajax加载
                        },
                        error: function(xhr, type){
                            $(".loading").html("暂无内容!");
                        }
                    });
                }
            });
        })
  • 相关阅读:
    JS原生带小白点轮播图
    JS原生轮播图
    Vue.js小案例(2)
    Vue.js小案例(1)
    Vuejs入门级简单实例
    Vue.js简单入门
    微信登录oauth2.0
    PHP四维数组、三维数组封装遍历
    常用linux命令30个
    好架构是进化来的,不是设计来的
  • 原文地址:https://www.cnblogs.com/baocheng/p/6055666.html
Copyright © 2011-2022 走看看