这个效果好,速度快,只能点击更多加载,不能滚动自动加载

一、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>

jQuery

$(function(){
$('#more').more({'address': 'data.php'})
});

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.sucaihuo.com/js/".$row['id'].".html' target='_blank'>".$row['title']."</a>",
'author' => $row['id'],
'date' => date('m-d H:i', $row['addtime'])
);
}
echo json_encode($sayList);

jquery.more.js相关API

参数 描述 默认值
amount 每次显示记录数 10
address 请求后台的地址 -
format 数据传输格式 json
template html记录DIV的class属性 .single_item -
trigger 触发加载更多记录的class属性 .get_more -
scroll 是否支持滚动触发加载 false
offset 滚动触发加载时的偏移量 100

七,源码下载

链接: https://pan.baidu.com/s/1x5wRisLRxAIpuQUSkO0BOg
提取码: qya7
 
 

PHP+Ajax点击加载更多内容 -这个效果好,速度快,只能点击更多加载,不能滚动自动加载的更多相关文章

  1. JS简单实现滚动自动加载新内容(懒加载)

    加载源 // 这里存后台发来的数据 var galleryList = [ { src: "./images/1.jpeg", desc: "11111" }, ...

  2. 前端 | 页面触底自动加载 Vue 组件

    不管是 web 端还是移动端,信息流都是现在很流行的信息展示方式.信息流经常搭配自动加载一起使用以获得更好的使用体验. 最近在使用 Vue 开发过程中也遇到了首页信息流自动加载的需求.大致了解了一下几 ...

  3. Composer概述及其自动加载探秘

    composer概述 一开始,最吸引我的当属 Composer 了,因为之前从没用过 Composer . Composer 是PHP中用来管理依赖关系的工具,你只需在自己的项目中声明所依赖的外部工具 ...

  4. Yii2的深入学习--自动加载机制

    Yii2 的自动加载分两部分,一部分是 Composer 的自动加载机制,另一部分是 Yii2 框架自身的自动加载机制. Composer自动加载 对于库的自动加载信息,Composer 生成了一个  ...

  5. Yii2的深入学习--自动加载机制(转)

    Yii2 的自动加载分两部分,一部分是 Composer 的自动加载机制,另一部分是 Yii2 框架自身的自动加载机制. Composer自动加载 对于库的自动加载信息,Composer 生成了一个  ...

  6. composer 实现自动加载原理

    简介 一般在框架中都会用到composer工具,用它来管理依赖.其中composer有类的自动加载机制,可以加载composer下载的库中的所有的类文件.那么composer的自动加载机制是怎么实现的 ...

  7. final关键字,类的自动加载,命名空间

    final关键字 1.final可以修饰方法和类,但是不能修饰属性: 2.Final修饰的类不能被继承: 3.Fina修饰的方法不能被重写,子类可以对已被final修饰的父类进行访问,但是不能对父类的 ...

  8. 29)PHP,自动加载类

    (1)作用: 类的自动加载是指,在外面的页面中,并不需要去“引入”(包含)类文件,但是程序会在需要一个类的时候就自动去“动态加载”该类. (2)什么叫做“需要一个类”?通常是这样的情况: 1,创建一个 ...

  9. Yaf框架下类的自动加载

    前面两篇博客分别讲述了PHP自带的类加载和composer中类的自动加载,其实Yaf框架也实现了基于PSR0和PSR4的类的自动加载.根据我对Yaf下类的自动加载方式的理解写下这篇博客.由于接触Yaf ...

随机推荐

  1. eax,ebx,ecx,edx,esi,edi,ebp,esp寄存器的作用

    位的寄存器.如果用C语言来解释,可以把这些寄存器当作变量看待. 比方说:add eax,-2 ;   //可以认为是给变量eax加上-2这样的一个值. 位寄存器有多种用途,但每一个都有"专长 ...

  2. UVA-108-Maximum Sum-子矩阵最大和(最大连续子序列的变形)+降维处理+dp

    A problem that is simple to solve in one dimension is often much more difficult to solve in more tha ...

  3. MyBatis - 常用标签与动态Sql

    MyBatis常用标签 ● 定义sql语句:select.insert.delete.update ● 配置JAVA对象属性与查询结构及中列明对应的关系:resultMap ● 控制动态sql拼接:i ...

  4. 第四周课堂笔记4th

    编码     Ascii美国 一个字节表示一个字符,必能表示汉子 大写字母65-90  小写字母97-122 265个位置 8位表示一个字节,  8bit=1byte GBK  中国 只包含本国文字 ...

  5. CentOS7-Minimal安装MySQL服务

    CentOS7默认安装的是Mariadb而不是mysql,而Mariadb是mysql的一个分支, 安装mysql会覆盖Mariadb 一.下载MySQL官方的 Yum Repository [roo ...

  6. reg命令详解

    reg命令是Windows提供的,它可以添加.更改和显示注册表项中的注册表子项信息和值. 1,reg add 将新的子项或项添加到注册表中  语法:reg add KeyName [/v EntryN ...

  7. thml粘连布局

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

  8. 小程序跳转传参参数值为url时参数丢失

    通过先encodeURIComponent,取到值以后再decodeURIComponent,拼接参数正常传递 A页面 switch: function (e) { var aa = 'UNNZVUf ...

  9. 平衡树模板【splay的实现】

    [平衡树splay实现] 无注释代码 #include<bits/stdc++.h> using namespace std; typedef long long LL; ,MAXN=1e ...

  10. 19-11-12-Aftern-℘

    我饿死了,于是写写博客安慰一下即将退役的自己. ZJ: T1. 三种颜色,想到一道神奇的‘天空龙’. 于是觉得此题可做. 那好了. 于是切掉,还拿了一个暴力对拍.疯狂A. 啊dfs慢的要死了 T2一眼 ...