php中加载更多,【jquery ，ajax，php】加载更多实例

jquery

$(function() {

//初始化

getData(0);

var index = 1;

$("#more").click(function() {

getData(index)

index = index + 1;

})

var cur_page = 1;

var total, total_page, page_size;

//ajax交互

function getData(pageIndex) {

$.ajax({

type: "POST",

url: "test.php",

data: {

"pageIndex": pageIndex

}, //传递参数，作为后台返回页码的依据

dataType: "json", //预期返回的数据为json

beforeSend: function() {

$("#more").text("正在加载中...")

},

success: function(json) { //成功获取数据后，返回json对象，这是一个json的名，以我的理解是json={。。。}

$("#more").text("加载更多...");

total = json.total; //获取json中的total属性值

pageSize = json.pageSize; //获取json中的pageSize属性值

totalPage = json.totalPage;

var list = json.list; //json中的list是一个数组

var li = "";

$.each(list, function(index, content) { //遍历list数组，index是下标，content是这个下标对应的值

li += "

• " + content['question'] + "
• " + content['answer'] + "

";

});

$("#list").append(li);

if (index >= totalPage) {

$("#more").text("没有了").css("background", "#555").unbind("click"); //取消绑定click事件

}

},

error: function() {

alert("加载错误");

}

})

}

})

php

include_once('conn.php');

$page = intval($_POST['pageIndex']);//接收前台发送的数据

if(!empty($page)){

$result = mysql_query("select id from test1");

$total = mysql_num_rows($result);//总记录数

$pageSize = 3; //每页显示数

$totalPage = ceil($total/$pageSize); //总页数

$startPage = $page*$pageSize;

$arr['total'] = $total;

$arr['pageSize'] = $pageSize;

$arr['totalPage'] = $totalPage;

$query = mysql_query("select id,question,answer from test1 order by id asc limit $startPage,$pageSize");

while($row=mysql_fetch_array($query)){//获取所有数据行

$arr['list'][] = array(

'id' => $row['id'],//把行中id字段的值赋值给id

'question' => $row['question'],

'answer' => $row['answer'],

);

}

mysql_query('SET NAMES UTF8');

header("Content-Type:text/html;charset = utf-8");

echo json_encode($arr);//转为为json格式，这里输出的字符格式与前台无关

}

?>

jquery weui ajax滚动加载更多

手机端使用jquery weui制作ajax滚动加载更多. 演示地址:http://wx.cnkfk.com/nuol/static/fpage.html 代码: html& ...

jQuery上拉加载更多

首 页

jquery 点击加载更多

html部分

-&lt ...

Jquery点击加载更多

一.点击加载更多有点像分页获取数据类似,下面是本人写的一个简单的小例子 /p>

jquery ajax 滚动加载数据

jquery php 滚动加载数据(文件包 rollingpage) 效果如下: 页面加载时候($function(){ 自动加载第一页数据 }) 设置: var winH = $(window).h ...

jquery ajax局部加载方法介绍

[导读] 在jquery中实现ajax加载的方法有很多种,不像以前的js的ajax只有那一种,下面我们介绍jquery ajax实现局部加载方法总结,有需要了解的朋友可参考.例 代码如下复制代码 $ ...

jquery 上滑加载更多

$(document).ready(function() { var totalPage = {$totalPage};//总页数 var page = {$page}; //起始页 var page ...

jquery列表自动加载更多

...

随机推荐

Css中的两个重要概念：块状元素和内联元素

一.display:block display:block就是将元素显示为块级元素,一般是其他元素的容器,可容纳内联元素和其他块状元素,块状元素排斥其他元素与其位于同一行,宽度(width)高度(he ...

Hibernate5.2之一对一主键关联(四)

Hibernate5.2之一对一主键关联(四) 一.简介 一对一关联关系分为两种:a.主键关联:b. ...

Netsharp快速入门(之4) 基础档案(之C 实体建模 计量单位、商品、往来单位)

作者:秋时 杨昶   时间:2014-02-15  转载须说明出处 3.3.2   基础档案建模 1.在基础档案项目,右击,选择新建包, 2.录入包的名称,录入名称.完成后点确定 3.3.2.1 计量 ...

index unique scan

INDEX UNIQUE SCAN 索引唯一扫描.单块读 只可能发生在unique index/primary key 等值查找                      等待事件:db file s ...

[HOJ2634] How to earn more 最大权闭合子图

Xiao Ming is an expert in computer science and technology, so he can get a lot of projects every mon ...

python 数据可视化 -- 真实数据的噪声平滑处理

平滑数据噪声的一个简单朴素的做法是,对窗口(样本)求平均,然后仅仅绘制出给定窗口的平均值,而不是所有的数据点. import matplotlib.pyplot as plt import numpy ...

java实操之使用jcraft进行sftp上传下载文件

sftp作为临时的文件存储位置,在某些场合还是有其应景的,比如对账文件存放.需要提供一个上传的工具类.实现方法参考下: pom.xml中引入类库:

P2415 集合求和

P2415 集合求和显然,一共有2^n个子集,对于其中的一个确定的元素,它不在的集合有2^(n-1),相当于有n-1元素,那么它存在的集合有,2^n-2^(n-1)==2^(n-1),那么集合的和为s ...

ElasticSearch - query vs filter

query vs filter 来自stackoverflow Stackoverflow - queries-vs-filters Question 题主希望知道Query和Filter的区别 An ...