这篇文章将为大家详细讲解有关PHP+jQuery如何实现滚屏无刷新动态加载数据功能，小编觉得挺实用的，因此分享给大家做个参考，希望大家阅读完这篇文章后可以有所收获。
具体如下：
index.php
<?php
require_once('connect.php'); //连接数据库
$user = array('demo1','demo2','demo3','demo3','<de></de>mo4'); //模拟了几个用户
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<title>滚屏加载--无刷新动态加载数据技术的应用</title>
<style type="text/css">
#container{margin:10px auto;width: 660px; border: 1px solid #999;}
.single_item{padding: 20px; border-bottom: 1px dotted #d3d3d3;}
.author{position: absolute; left: 0px; font-weight:bold; color:#39f}
.date{position: absolute; right: 0px; color:#999}
.content{line-height:20px; word-break: break-all;}
.element_head{width: 100%; position: relative; height: 20px;}
.nodata{display:none; height:32px; line-height:32px; text-align:center; color:#999; font-size:14px}
</style>
<script type="text/javascript" src="jquery-1.8.3.min.js"></script> //需要引入jquery
</head>
<body>
<p class="one" >提示：使用滚动或拉动滚动条向下看。</p>
<div id="container">
<?php
$query=mysqli_query($link, "select * from say order by id desc limit 0,15");
while ($row=mysqli_fetch_array($query, MYSQLI_ASSOC)) {
?>
<div class="single_item">
<div class="element_head">
<div class="date"><?php echo date('m-d H:i',$row['addtime']);?></div>
<div class="author"><?php echo $user[$row['userid']];?></div>
</div>
<div class="content"><?php echo $row['content'];?></div>
</div>
<?php } ?>
</div>
<div class="nodata"></div>
</body>
<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>
</html>ajax_demo.sql
-- phpMyAdmin SQL Dump -- version 3.5.2.2 -- http://www.phpmyadmin.net -- -- 主机: localhost -- 生成日期: 2015 年 01 月 18 日 15:56 -- 服务器版本: 5.1.46-community -- PHP 版本: 5.2.13 SET SQL_MODE="NO_AUTO_VALUE_ON_ZERO"; SET time_zone = "+00:00"; /*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */; /*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */; /*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */; /*!40101 SET NAMES utf8 */; -- -- 数据库: `demo` -- -- -------------------------------------------------------- -- -- 表的结构 `say` -- CREATE TABLE IF NOT EXISTS `say` ( `id` int(11) NOT NULL AUTO_INCREMENT, `userid` int(11) NOT NULL DEFAULT '0', `content` varchar(200) NOT NULL, `addtime` int(10) NOT NULL, PRIMARY KEY (`id`) ) ENGINE=MyISAM DEFAULT CHARSET=utf8 AUTO_INCREMENT=63 ; -- -- 转存表中的数据 `say` -- INSERT INTO `say` (`id`, `userid`, `content`, `addtime`) VALUES (1, 0, '爱爱爱', 1421332482), (2, 1, '爱爱爱', 1421332482), (3, 0, '爱爱爱', 1421332482), (4, 1, '爱爱爱', 1421332482), (5, 0, '爱爱爱', 1421332482), (6, 0, '爱爱爱', 1421332482), (7, 0, '爱爱爱', 1421332482), (8, 2, '爱爱爱', 1421332482), (9, 0, '爱爱爱', 1421332482), (10, 0, '爱爱爱', 1421332482), (11, 0, '爱爱爱', 1421332482), (12, 0, '爱爱爱', 1421332482), (13, 0, '爱爱爱', 1421332482), (14, 0, '爱爱爱', 1421332482), (15, 0, '爱爱爱', 1421332482), (16, 0, '爱爱爱', 1421332482), (17, 0, '爱爱爱', 1421332482), (18, 0, '爱爱爱', 1421332482), (19, 0, '爱爱爱', 1421332482), (20, 0, '爱爱爱', 1421332482), (21, 0, '爱爱爱', 1421332482), (22, 0, '爱爱爱', 1421332482), (23, 0, '爱爱爱', 1421332482), (24, 0, '爱爱爱', 1421332482), (25, 0, '爱爱爱', 1421332482), (26, 0, '2222', 1421333156), (27, 0, '2222', 1421333159), (28, 0, '2222', 1421333161), (29, 0, '2222', 1421333162), (30, 0, '2222', 1421333164), (31, 0, '2222', 1421333165), (32, 0, '2222', 1421333167), (33, 0, '2222', 1421333168), (34, 0, '2222', 1421333169), (35, 0, '2222', 1421333170), (36, 0, '2222', 1421333172), (37, 0, '2222', 1421333173), (38, 0, '2222', 1421333175), (39, 0, '2222', 1421333176), (40, 0, '2222', 1421333177), (41, 0, '2222', 1421333178), (42, 0, '2222', 1421333179), (43, 0, '2222', 1421333181), (44, 0, '2222', 1421333182), (45, 0, '2222', 1421333183), (46, 0, '2222', 1421333184), (47, 0, '2222', 1421333293), (48, 0, '2222', 1421333295), (49, 0, '2222', 1421333296), (50, 0, '2222', 1421333297), (51, 0, '2222', 1421333298), (52, 0, '2222', 1421333299), (53, 0, '2222', 1421333300), (54, 0, '2222', 1421333302), (55, 0, '2222', 1421333303), (56, 0, '2222', 1421333304), (57, 0, '2222', 1421333305), (58, 0, '2222', 1421333306), (59, 0, '2222', 1421333308), (60, 0, '2222', 1421333309), (61, 0, '2222', 1421333310), (62, 0, '2222', 1421333311); /*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */; /*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */; /*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;
result.php 接收请求页面
<?php
require_once('connect.php'); //连接数据库
$user = array('demo1','demo2','demo3','demo3','demo4');
$page = intval($_GET['page']); //获取请求的页数
$start = $page*15;
$query=mysqli_query($link, "select * from say order by id desc limit $start,15");
/* while ($row=mysqli_fetch_array($query)) {
$arr[] = array(
'content'=>$row['content'],
'author'=>$user[$row['userid']],
'date'=>date('m-d H:i',$row['addtime'])
);
} */
if($query){
while ($row=mysqli_fetch_array($query)) {
$arr[] = array(
'content'=>$row['content'],
'author'=>$user[$row['userid']],
'date'=>date('m-d H:i',$row['addtime'])
);
}
}
if(!empty($arr)){
echo json_encode($arr); //转换为json数据输出
}
//echo json_encode($arr); //转换为json数据输出
?>connect.php 数据库配置文件
<?php
$host="localhost";
$db_user="root";
$db_pass="admin";
$db_name="ajax_demo";
$timezone="Asia/Shanghai";
$link=mysqli_connect($host,$db_user,$db_pass);
mysqli_select_db($link, $db_name);
mysqli_query($link, "SET names UTF8");
header("Content-Type: text/html; charset=utf-8");
?>关于“PHP+jQuery如何实现滚屏无刷新动态加载数据功能”这篇文章就分享到这里了，希望以上内容可以对大家有一定的帮助，使各位可以学到更多知识，如果觉得文章不错，请把它分享出去让更多的人看到。
免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：is@yisu.com进行举报，并提供相关证据，一经查实，将立刻删除涉嫌侵权内容。
