js滚动条底部自动加载

js 代码

$(function(){
    var totalHeight = 0; //定义一个总高度变量
    function ata(){ //loa动态加载数据
        totalHeight =  parseFloat( $(window).height() ) +  parseFloat( $(window).scrollTop() ); //浏览器的高度加上滚动条的高度
        if( $(document).height() <= totalHeight ) { //当文档的高度小于或者等于总的高度时，开始动态加载数据
            $("#container").append("
我是新加载出来的数据
"); //加载数据
        }
    }
    $(window).scroll(function(){
        console.log( "滚动条到顶部的垂直高度：" +  $(window).scrollTop()  );
        console.log( "页面的文档高度：" +  $(document).height()  );
        console.log( "浏览器的高度：" +  $(window).height()  );
        ata();
    });
});

html 代码

    

        
1
        
1
        
1
        
1
        
1
        
1
        
1
        
1
        
1
        
1
        
1
        
1
        
1
        
1
        
4
        
1
        
1
        
1
        
1
        
1
        
1
    
    
 //加载数据的位置