移動端web 滾動分頁

標籤：隱藏   logs   page   model   blog   odata   inner   turn   lag   

前端代碼：

<script type="text/javascript">        var page = 2; //當前頁的頁碼        var flagNoData = false; //false        var allpage = @Model.PageCount; //總頁碼，會從後台擷取        function showAjax(currentIndex) {            $.ajax({                url: "@Url.Action("GetEmployeeData", "Home")",                type: "GET",                data: {"pageNum":currentIndex},                success: function (data) {                    //要執行的內容                    showContent(data);                    if (currentIndex >= allpage) { //當前頁碼大於等於總頁碼                        flagNoData = true;                    };                    page += 1;    //頁數加1                }            })        }        function scrollFn() {            //真實內容的高度            var pageHeight = Math.max(document.body.scrollHeight, document.body.offsetHeight);            //視窗的高度            var viewportHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight || 0;            //隱藏的高度            var scrollHeight = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;            if (flagNoData) { //資料全部載入完了                return;            } else if (pageHeight - viewportHeight - scrollHeight < 10) {    //如果滿足觸發條件，執行                showAjax(page);            }        }        $(window).bind("scroll", scrollFn);    //綁定滾動事件        function showContent(datacontent)        {            $("#contentDiv").append(datacontent);        }    </script>

適合移動端、PC端頁面下拉 滾動分頁

移動端web 滾動分頁