手机直播源码，JS实现页面下拉加载数据操作

主要是在id="ph"的div内加载数据：

<br><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><br><html xmlns="http://www.w3.org/1999/xhtml"><br><head><br>    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><br>    <title></title><br>    <script src="js/jquery.min.js"></script><br>    <script src="js/test.js?v=<?php echo($_Version_); ?>"></script><br></head><br><body><br><div id="ph" align="center"><br><!-- 这里是加载的内容区域--><br></div><br><div align="center"><br>    <img id="img_load" src="http://www.lkhk.life/images/loading.svg" width="60" style="display: none"><br></div><br></body><br></html><br> 

js代码功能如下：

<br>var num_pages = 50;       //总页数，也是拉下加载的次数<br>var current_page = 1;    //当前页数，不能超过总页数<br>var timers = null;      //定义一个定时器<br>var srcoll_flag = true; // 定义一个开关，等会用来控制多次触发<br>//初始化页面,页面第一次加载时或者刷新时会执行<br>window.onload=function(){<br>    page_loadmore(current_page);//默认加载一次图片，这段代码可以不要<br>};<br>//监测下拉操作，执行拉下函数加载数据<br>$(window).scroll(function() {<br>    var scrollTop = $(this).scrollTop();        //浏览器可视窗口顶端距离网页顶端的高度（垂直偏移）<br>    var scrollHeight = $(document).height();    //整个文档高度<br>    var windowHeight = $(this).height();        //浏览器可视窗口高度<br>    if (scrollTop + windowHeight + 60 >= scrollHeight) {<br>        // 此处是滚动条距离底部60px时候触发的事件，在这里写要加载的数据，或者是拉动滚动条的操作<br>        if(srcoll_flag == true){    //检测下拉开关是否打开状态，如果是则执行下拉操作<br>            srcoll_flag = false;    //关闭下拉开关<br>            //***********可以定义自己的拉下操作***************<br>            if(current_page <= num_pages){  //如果不是最后一页，则执行下拉参数<br>                $("#img_load").css('display','block'); //显示loading图标提醒加载动作<br>                clearTimeout(timers);<br>                timers = setTimeout(function(){<br>                    page_loadmore();// 发现拉下操作，执行下拉函数<br>                },500);<br>            }<br>            //*********************************************<br>        }<br>    }<br>});<br>//加载数据函数<br>function page_loadmore() {<br>    $("#img_load").css('display','none'); //隐藏加载图标，开始加载数据<br>    //***********可以修改为自己的下拉操作函数************<br>    $.getJSON("http://lkhk.life/JBRH/mm.php?jsoncallback=?",{nums:3,sid:Math.random()},function (json) {<br>        for(i in json){<br>            $("#ph").append("<img width='750' src='"+json[i].imagepath+"'><br><p>");<br>        }<br>    });<br>    current_page++;<br>    //***********************************************<br>    clearTimeout(timers); //先清除定时器。执行<br>    timers = setTimeout(function(){<br>        srcoll_flag = true;<br>    },1000);    //1秒后再打开下拉开关，防止多次操作，很重要<br>}

以上就是手机直播源码，JS实现页面下拉加载数据操作，更多内容欢迎关注之后的文章