无刷新动态加载数据 滚动条加载适合评论等页面


Posted in PHP onOctober 16, 2013

滚屏加载更多数据,适合评论等页面

本例的数据库很简单,一看就明了
无刷新动态加载数据 滚动条加载适合评论等页面 

<div id="container"> <?php 
$query=mysql_query("select * from content order by id desc limit 0,10"); 
while ($row=mysql_fetch_array($query)) { 
?> 
<div class="single_item"> 
<div class="element_head"> 
<div class="date"><?php echo date('m-d H:i',strtotime($row['updatetime']));?></div> 
<div class="author"><?php echo $row['id'];?></div> 
</div> 
<div class="content"><?php echo $row['message'];?></div> 
</div> 
<?php } ?> 
</div> 
<div class="nodata"></div>

js文件
<script type="text/javascript"> 
$(function(){ 
var winH = $(window).height(); //页面可视区域高度 
var i = 1; 
$(window).scroll(function () { 
var pageH = $(document.body).height(); 
var scrollT = $(window).scrollTop(); //滚动条top 
var aa = (pageH-winH-scrollT)/winH; 
if(aa<0.02){ 
$.getJSON("result.php",{page:i},function(json){ 
if(json){ 
var str = ""; 
$.each(json,function(index,array){ 
var str = "<div class=\"single_item\"><div class=\"element_head\">"; 
var str = str + "<div class=\"date\">"+array['date']+"</div>"; 
var str = str + "<div class=\"author\">"+array['author']+"</div>"; 
var str = str + "</div><div class=\"content\">"+array['content']+"</div></div>"; 
$("#container").append(str); 
}); 
i++; 
}else{ 
$(".nodata").show().html("别滚动了,已经到底了。。。"); 
return false; 
} 
}); 
} 
}); 
}); 
</script>

result.php
<?php 
include("conn.php"); $page = intval($_GET['page']); //获取请求的页数 
$start = $page*5; 
$query=mysql_query("select * from content order by id desc limit $start,5"); 
while ($row=mysql_fetch_array($query)) { 
$arr[] = array( 
'content'=>$row['message'], 
'author'=>$row['id'], 
'date'=>date('m-d H:i',strtotime($row['updatetime'])) 
); 
} 
echo json_encode($arr); //转换为json数据输出 
?>
PHP 相关文章推荐
请php正则走开
Mar 15 PHP
Windows Apache2.2.11及Php5.2.9-1的安装与配置方法
Jun 08 PHP
php file_exists 检查文件或目录是否存在的函数
May 10 PHP
php中json_decode()和json_encode()的使用方法
Jun 04 PHP
使用PHP计算两个路径的相对路径
Jun 14 PHP
解析如何用php screw加密php源代码
Jun 20 PHP
php实现的一个很好用HTML解析器类可用于采集数据
Sep 23 PHP
php使用百度翻译api示例分享
Jan 31 PHP
PHP使用curl模拟post上传及接收文件的方法
Mar 04 PHP
使用php从身份证号中获取一系列线索(星座、生肖、生日等)
May 11 PHP
thinkPHP商城公告功能开发问题分析
Dec 01 PHP
通过源码解析Laravel的依赖注入
Jan 22 PHP
PHP字符串长度计算 - strlen()函数使用介绍
Oct 15 #PHP
php后台如何避免用户直接进入方法实例
Oct 15 #PHP
php下拉选项的批量操作的实现代码
Oct 14 #PHP
php登陆页的密码处理方式分享
Oct 14 #PHP
PHP设置图片文件上传大小的具体实现方法
Oct 11 #PHP
PHP关于IE下的iframe跨域导致session丢失问题解决方法
Oct 10 #PHP
php检测网页是否被百度收录的函数代码
Oct 09 #PHP
You might like
PHP 采集程序 常用函数
2008/12/18 PHP
Windows中使用计划任务自动执行PHP程序实例
2014/05/09 PHP
thinkPHP订单数字提醒功能的实现方法
2016/12/01 PHP
JQuery下的Live方法和$.browser方法使用代码
2010/06/02 Javascript
深入分析escape()、encodeURI()、encodeURIComponent()的区别及示例
2014/08/04 Javascript
JavaScript实现找出字符串中第一个不重复的字符
2014/09/03 Javascript
TypeScript具有的几个不同特质
2015/04/07 Javascript
Bootstrap每天必学之简单入门
2015/11/19 Javascript
jquery配合.NET实现点击指定绑定数据并且能够一键下载
2016/10/28 Javascript
基于Vue如何封装分页组件
2016/12/16 Javascript
vue2的todolist入门小项目的详细解析
2017/05/11 Javascript
详解IWinter 一个路由转控制器的 Nodejs 库
2017/11/15 NodeJs
微信小程序wepy框架笔记小结
2018/08/08 Javascript
vue、react等单页面项目部署到服务器的方法及vue和react的区别
2018/09/29 Javascript
javascript数组去重方法总结(推荐)
2019/03/20 Javascript
JavaScript代码压缩工具UglifyJS和Google Closure Compiler的基本用法
2020/04/13 Javascript
梳理一下vue中的生命周期
2020/12/30 Vue.js
老生常谈Python进阶之装饰器
2017/05/11 Python
Python 多进程并发操作中进程池Pool的实例
2017/11/01 Python
python实现flappy bird小游戏
2018/12/24 Python
python实现弹窗祝福效果
2019/04/07 Python
用python画一只可爱的皮卡丘实例
2019/11/21 Python
Roxy美国官网:澳大利亚冲浪、滑雪健身品牌
2016/07/30 全球购物
俄罗斯汽车零件和配件在线商店:CarvilleShop
2019/11/29 全球购物
药物学专业学生的自我评价
2013/10/27 职场文书
销售工作人员的自我评价分享
2013/11/10 职场文书
办公室前台岗位职责
2014/01/04 职场文书
社区母亲节活动方案
2014/03/05 职场文书
教学评估实施方案
2014/03/16 职场文书
婚前协议书范本
2014/04/15 职场文书
2015年暑期社会实践活动总结
2015/03/27 职场文书
2015年志愿者服务工作总结
2015/04/20 职场文书
学雷锋广播稿大全
2015/08/19 职场文书
导游词之麻姑仙境
2019/11/18 职场文书
html5实现点击弹出图片功能
2021/07/16 HTML / CSS
CSS 左边固定宽右边自适应的6种方法
2022/05/15 HTML / CSS