基于JQuery实施滚动到页面底端时自动加载更多信息

发布时间：2023-10-03 15:03:18 所属栏目：教程来源：

导读：代码如下:

var stop=true;

$(window).scroll(function(){

totalheight = parseFloat($(window).height()) + parseFloat($(window).scrollTop());

if($(document).height() <= totalheight){

代码如下:

var stop=true;

$(window).scroll(function(){

    totalheight = parseFloat($(window).height()) + parseFloat($(window).scrollTop());

    if($(document).height() <= totalheight){

        if(stop==true){

            stop=false;

            $.post("ajax.php", {start:1, n:50},function(txt){

                $("#Loading").before(txt);

                stop=true;

            },"text");

        }

    }

});

HTML：

代码如下:

<div id="Loading">Loading...</div>

实现方法是比较页面总高度和下滚高度以判断是否到达底端，若到达底端则通过ajax读取更多的内容，用before插入到Loading之前。

stop参数是考虑到ajax读取耗时，防止在一次ajax读取过程中多次触发事件，造成多次加载内容。

（编辑：聊城站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!