zoukankan      html  css  js  c++  java
  • ajax鼠标滚动请求 或 手机往下拉请求

    Zepto(function($){
            var url = $('.page-url').val();
            var cur = false;
            var href_url =  $('.page-url').attr('href-url');
            $(window).scroll(function(){
                if(($(window).scrollTop() + $(window).height() - $(document).height() == 0) ){//判断滚动条是否到达了底部
                    if(cur == true){
                        return;//定义一个变量,让ajax执行完成后再请求下一次ajax。否则返回。
                    }
                    cur = true;
                    $(".loading").show();//出现加载图片
                    $.ajax({
                        type:'POST',
                        url:url,
                        dataType: 'json',
                        success: function(data){
                            //console.log(data);
                            $('.page-url').val(data.nextPageUrl);
                            url = $('.page-url').val();
                           // console.log(url);
                           $(".loading").remove();//删除加载图片
                            $(".comments").remove();
                            var html = '';
                            var list = data.listNews;
                            $.each(list, function(i, item){      
    html += "<div class='w100 title-list'>
        <a href='"+href_url+"?news_type="+item.news_type+"&news_id="+item.news_id+"' alt='' class='fl titile-list-img'><img src='"+item.thumb+"' /></a>
        <div class='title-list-content fr'>
            <p><a href='"+href_url+"?news_type="+item.news_type+"&news_id="+item.news_id+"' alt='' >"+item.title+"</a></p>
            <span class='grayb3 tr lineh1'>"+item.ptime+"</span>
        </div>
        <div class='cl'></div>
    </div>  ";
                            });
                            
                            $('.data-list').append(html);
                            if(data.para===false) cur = true;//判断后台是否还有数据可以加载
                            else cur = false;                        
                        },
                        error: function(xhr, type){
                            $(".loading").html("暂无内容!");
    
                        }
                    });
                }
            });
    })
  • 相关阅读:
    vue 无缝无限滚动横条实现
    小程序 recycle-view 个人demo
    js 笔记
    java整理的一些面试资料
    使用js获取浏览器地址栏里的参数
    java面试题
    sql中索引不会被用到的几种情况
    常用linux命令
    shiro登录成功之后跳转原路径
    springboot 整合 mongodb实现 批量更新数据
  • 原文地址:https://www.cnblogs.com/jami918/p/3607291.html
Copyright © 2011-2022 走看看