js 窗口滚动到一定高度时加载数据

复制代码
<script type="text/javascript">
        //当窗口滚动到一定高度时 某块页面开始加载数据
        window.onload = function()
        {
            var oHeader = document.getElementById("header");
            var height = oHeader.offsetHeight;
            
            window.onscroll = function(){
                //scrollTop的值
                var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
                //窗口可视化高度
                var clientHeight = document.documentElement.clientHeight || document.body.clientHeight;
                document.getElementById("txt1").value="scrollTop:"+scrollTop+",height:"+height;
                var oContent = document.getElementById("content");
                
                if(scrollTop+clientHeight >height)
                {
                   oContent.innerHTML = "<h1>正在加载中.....</h1>";
                   
                   //延迟3秒执行
                   setTimeout(function(){
                     oContent.innerHTML = "<h1>scroll事件执行的代码块</h1>";
                     oContent.style.background="red";
                   },3000);  
                  
                }
                else
                {
                    oContent.innerHTML="";
                    oContent.removeAttribute("style");
                }
            }
        }
    </script>
复制代码

 

posted @   大空白纸  阅读(959)  评论(0编辑  收藏  举报
编辑推荐:
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
阅读排行:
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
点击右上角即可分享
微信分享提示