无刷新动态加载数据 滚动条加载适合评论等页面
更新时间：2013年10月16日 17:18:38 作者：
无刷新动态加载数据，滚屏加载更多数据,适合评论等页面，具体实现如下，感兴趣的朋友可以参考下
滚屏加载更多数据,适合评论等页面
本例的数据库很简单，一看就明了
<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数据输出
?>
本例的数据库很简单，一看就明了
复制代码 代码如下:
<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数据输出
?>
相关文章
这篇文章主要介绍了Git命令之分支详解，步骤介绍的很详细，有需要的同学可以参考下2021-03-03
这篇文章主要介绍了php实现在服务器上创建目录的方法,实例分析了php中使用mkdir函数的使用技巧,需要的朋友可以参考下2015-03-03
这篇文章主要介绍了PHP基于工厂模式实现的计算器,实例分析了php工厂模式的实现原理与应用技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-07-07
strtotime函数是一个很好的函数,灵活的运用它,会给你的工作带来不少方便.但PHP的手册中却对此函数的参数没作太多介绍,对些函数的其他介绍也非常少。2009-12-12
本文为大家详细介绍下php如何生成txt文件标题及内容，下面有个不错的示例，大家可以感受下2014-01-01
这篇文章主要介绍了php求斐波那契数的两种实现方式,结合实例形式分析了php使用递归与递推算法实现求斐波那契数的相关操作技巧与注意事项,需要的朋友可以参考下2019-09-09
在使用PHP代码时,您可能经常会遇到parent::、static::和self::,但是当你第一次作为一个开发人员开始的时候,有时候你会很困惑,不知道它们是做什么的,以及它们之间的区别,本文给大家介绍了PHP关键字Self、Static和parent的区别,需要的朋友可以参考下2024-12-12
当前比较流行的两款PHP加密、解密工具Zend Guard和iconCube介绍
这篇文章主要介绍了当前比较流行的两款PHP加密、解密工具Zend Guard和iconCube介绍,本文还给出了iconCube的安装教程,需要的朋友可以参考下2014-09-09
在php计算字符串相似度similar_text与相似度levenshtein函数的详细介绍，下面我们详细的介绍一下关于字符串相似度介绍2012-12-12
这篇文章主要介绍了PHP命名空间namespace定义及导入use用法,结合实例形式详细分析了php中命名空间namespace的功能、定义及导入use相关使用方法与操作技巧,需要的朋友可以参考下2018-03-03
最新评论