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


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 连接mysql连接被重置的解决方法
Feb 15 PHP
php session安全问题分析
Jun 24 PHP
php将时间差转换为字符串提示
Sep 07 PHP
PHP函数eval()介绍和使用示例
Aug 20 PHP
PHP递归复制、移动目录的自定义函数分享
Nov 18 PHP
php使用for语句输出三角形的方法
Jun 09 PHP
PHP实现的DES加密解密实例代码
Apr 06 PHP
php文件上传类完整实例
May 14 PHP
基于swoole实现多人聊天室
Jun 14 PHP
laravel框架模板之公共模板、继承、包含实现方法分析
Aug 30 PHP
PhpStorm+xdebug+postman调试技巧分享
Sep 15 PHP
一文搞懂php的垃圾回收机制
Jun 18 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文件向另一个地址post数据,不用表单和隐藏的变量的
2007/03/06 PHP
php的list()的一步操作给一组变量进行赋值的使用
2011/05/18 PHP
PHP中copy on write写时复制机制介绍
2014/05/13 PHP
PHP获取当前日期和时间及格式化方法参数
2015/05/11 PHP
PHP中strnatcmp()函数“自然排序算法”进行字符串比较用法分析(对比strcmp函数)
2016/01/07 PHP
asp.net下利用js实现返回上一页的实现方法小集
2009/11/24 Javascript
JS input文本框禁用右键和复制粘贴功能的代码
2010/04/15 Javascript
JavaScript中去掉数组中的重复值的实现方法
2011/08/03 Javascript
JavaScript表达式:URL 协议介绍
2013/03/10 Javascript
jQuery之选择组件的深入解析
2013/06/19 Javascript
JavaScript数组Array对象增加和删除元素方法总结
2015/01/20 Javascript
JavaScript中Number.MAX_VALUE属性的使用方法
2015/06/04 Javascript
jQuery Validate插件实现表单强大的验证功能
2015/12/18 Javascript
Extjs 中的 Treepanel 实现菜单级联选中效果及实例代码
2017/08/22 Javascript
详解在vue-cli中引用jQuery、bootstrap以及使用sass、less编写css
2017/11/08 jQuery
bootstrap轮播模板使用方法详解
2017/11/17 Javascript
vue 动态修改a标签的样式的方法
2018/01/18 Javascript
JS隐藏号码中间4位代码实例
2019/04/09 Javascript
js实现的在本地预览图片功能示例
2019/11/09 Javascript
[40:06]DOTA2亚洲邀请赛 4.3 突围赛 Liquid vs VGJ.T 第一场
2018/04/04 DOTA
Python实现按照指定要求逆序输出一个数字的方法
2018/04/19 Python
python 下 CMake 安装配置 OPENCV 4.1.1的方法
2019/09/30 Python
python和opencv构建运动检测器的实现
2021/03/03 Python
纯css3实现的鼠标悬停动画按钮
2014/12/23 HTML / CSS
Sneaker Studio波兰:购买运动鞋
2018/04/28 全球购物
Shop Apotheke瑞士:您的健康与美容网上商店
2019/10/09 全球购物
软件测试常见笔试题
2012/02/04 面试题
校运会入场式解说词
2014/02/10 职场文书
晚会主持词开场白
2014/03/17 职场文书
抗洪救灾先进集体事迹材料
2014/05/26 职场文书
汽车销售经理岗位职责
2014/06/09 职场文书
合同意向书范本
2014/07/30 职场文书
2014年学生会干事工作总结
2014/11/07 职场文书
草房子读书笔记
2015/06/29 职场文书
Oracle 数据仓库ETL技术之多表插入语句的示例详解
2021/04/12 Oracle
SQL中的连接查询详解
2022/06/21 SQL Server