一款简单实用的PHP+Ajax点击加载更多列表数据实例,实现原理:通过“更多”按钮向服务端发送Ajax请求,PHP根据分页参数查询将最新的几条记录,数据以JSON形式返回,前台Query解析JSON数据,并将数据追加到列表页。其实也是Ajax分页效果。

html代码:

 <div id="more">
<div class="single_item">
<div class="element_head">
<div class="date"></div>
<div class="author"></div>
</div>
<div class="content"></div>
</div>
<a href="javascript:;" class="get_more">::点击加载更多内容::</a>
</div>

引入jQuery插件和jquery.more.js加载更多插件:

 <script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.more.js"></script>
$(function(){
$('#more').more({'address': 'data.php'})
});

data.php接收前台页面提交过来的两个参数,$_POST['last']即开始记录数,$_POST['amount']即单次显示记录数,看SQL语句就明白,其实就是分页中用到的语句。

 require_once('connect.php'); 

 $last = $_POST['last'];
$amount = $_POST['amount']; $query = mysql_query("select * from article order by id desc limit $last,$amount");
while ($row = mysql_fetch_array($query)) {
$sayList[] = array(
'title' => "<a href='http://www.xxx.com/".$row['id'].".html' target='_blank'>".$row['title']."</a>",
'author' => $row['id'],
'date' => date('m-d H:i', $row['addtime'])
);
}
echo json_encode($sayList);

本文转自:https://www.sucaihuo.com/php/380.html 转载请注明出处!

PHP+Ajax点击加载更多列表数据实例的更多相关文章

  1. ajax点击加载更多数据图片(预加载)

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  2. PHP+Ajax点击加载更多内容 -这个效果好,速度快,只能点击更多加载,不能滚动自动加载

    这个效果好,速度快,只能点击更多加载,不能滚动自动加载 一.HTML部分 <div id="more"> <div class="single_item ...

  3. PHP+Ajax点击加载更多内容

    css样式: <style type="text/css"> #more{margin:10px auto;width: 560px; border: 1px soli ...

  4. jQuery+php+Ajax文章列表点击加载更多功能

    jQuery+php+Ajax实现的一个简单实用的文章列表点击加载更多功能,点击加载更多按钮,文章列表加载更多数据,加载中有loading动画效果. js部分: <script type=&qu ...

  5. Jquery点击加载更多

    一.点击加载更多有点像分页获取数据类似,下面是本人写的一个简单的小例子 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitiona ...

  6. js点击加载更多可以增加几条数据的显示

      <div class="list"> <div class="one"> <div class="img" ...

  7. Spring+Hibernate+struts2+JPA 注解+跨域//完成手机端点击加载更多 下拉加载更多

    一.使用IDEA新建一个maven项目(student) 1.1.0编写pom文件,添加项目所需要的包 <?xml version="1.0" encoding=" ...

  8. tableView中的“点击加载更多”点击不到

    假设当前的tableView是_tableView,则可以这样设置 _tableView.contentInset = UIEdgeInsetsMake(0, 0, 100, 0); 该属性用于设置当 ...

  9. android ListView的上部下拉刷新下部点击加载更多具体实现及拓展

    android ListView的上部下拉刷新下部点击加载更多具体实现及拓展 ListView下拉刷新,上拉自动加载更多 下拉刷新以及加载更多

随机推荐

  1. CSS属性继承

    在CSS中有一些属性是可以继承的,跟继承家产一样,哎,一代一代的往下传,而有些属性就比较惨了,不能继承,只能自己来设置. 我简略的总结了一下一些可以继承和不可以继承的属性 可继承 1.字体系列属性:f ...

  2. IE浏览器远程代码执行高危漏洞(CVE-2019-1367)

    IE浏览器远程代码执行高危漏洞(CVE-2019-1367)加固遇到的问题 一.背景介绍 Internet Explorer,是微软公司推出的一款网页浏览器.用户量极大.9月23日微软紧急发布安全更新 ...

  3. InnoSetup 根据选择的安装语言显示不同语言的(协议)License和更新说明

    需求 在安装时,选择中文安装,显示中文版协议(License)文件. 在安装时,选择英文安装,显示英文版协议(License)文件. 解决 [Languages] 段中有LicenseFile属性和I ...

  4. 在Windows下配置多个git账号

    1.生成并部署SSH key 安装好Git客户端后,打开git bash,输入以下命令生成user1的SSH Key: ssh-keygen -t rsa -C "user1@email.c ...

  5. linu运行级别

    一.介绍 0:关机 1:单用户[找回丢失密码] 2:多用户状态[无网络服务] 3:多用户状态[有网络服务] 4:保留级别 5:图形界面 6:系统重启 二.命令行运行级别 比如说关机 init 0 三. ...

  6. Java中的“浅复制”与“深复制”

    复制 将一个对象的引用复制给另一个对象,一共有三种方式.第一种方式是直接赋值,第二种方式是浅复制,第三种方式是深复制. 1.直接赋值 在Java中,A a1 = a2,这实际上复制的是引用,也就是说 ...

  7. Linux-shell学习笔记2

    1.命令的运行顺序 以相对/绝对路径运行命令,例如『 /bin/ls 』或『 ./ls 』: 由 alias 找到该命令来运行: 由 bash 内建的 (builtin) 命令来运行: 通过 $PAT ...

  8. 创建密钥并使用密钥ssh登录linux

    创建密钥并使用密钥ssh登录linux 使用密钥对登录ssh简介 通过ssh_keygen胜场公钥和私钥,公钥放在要登录的目标的机器上,私钥放登录发起的机器上. 生成密钥 我是在ubuntu上生成的密 ...

  9. 记一次mq无法正常生产消息的事故排查过程

    早上上班后得知,服务费未同步到代理商系统.查看draft_server系统生产环境的log,显示在往RabbitMQ推数据时出现异常:no route to host. 2019-07-29 01:3 ...

  10. java中的IO流操作总结

    概要: