• 鼠标滚动,自动加载数据


    一、手动点击加载:

        <div class="coursecontent clearfix" id="divContent">
        </div>
        <input type="button" value="next" onclick="getPage(false)" />
            @*$(document).ready(function () {
                getPage(true);
            });
    
            //******************************************************分页用到 开始
            var limit = 10;
            var offset = 0;
            var order = "createdate";
            var isAsc = false;
    
            function getPage(isFirst) {
                if (isFirst) {
                    limit = 10;
                    offset = 0;
                }
                else {
                    offset += limit;
                }
                $.get("@Url.Action("List", "Library")", { limit: limit, offset: offset, order: order, isAsc: isAsc },
                function (data) {
                    if (isFirst) {
                        $("#divContent").html(data);
                    }
                    else {
                        $("#divContent").append(data);
                    }
                });
            }
            //******************************************************分页用到 结束*@

     二、自动加载:

    <div class="coursecontent clearfix" id="divContent">
        </div>
            var limit = 50;
            var offset = 0;
            var order = "createdate";
            var isAsc = false;
    
            $(document).ready(function () {
                //第一次加载
                loadMore(true);
    
                //滚动时加载
                $(window).scroll(function () {
                    //当滚动到最底部以上1像素时,加载新内容
                    if ($(document).height() - $(this).scrollTop() - $(this).height() < 1) {
                        loadMore(false);
                    }
                });
            });
    
            function loadMore(isFirst) {
    
                if (isFirst) {
                    offset = 0;
                }
                else {
                    offset += limit;
                }
    
                $.ajax({
                    url: '/library/list',
                    method: "get",
                    dataType: 'text',
                    data: { limit: limit, offset: offset, order: order, isAsc: isAsc },
                    success: function (data) {
                        if (isFirst) {
                            $("#divContent").html(data);
                        }
                        else {
                            $("#divContent").append(data);
                        }
                    }
                });
            }
  • 相关阅读:
    元数据的优势
    老婆从今天开始出差
    清单元数据表中的导出类型定义
    Singleton模式
    拖管代码的优势
    元数据
    "软件随想录"阅读笔记
    《敏捷软件开发》学习笔记:敏捷设计原则
    项目管理中的三个"凡是"
    Python基础(1):数据类型
  • 原文地址:https://www.cnblogs.com/subendong/p/4387280.html
Copyright © 2020-2023  润新知