/* ajax分页 */
var page_cur = 1; //当前页
var total_num, page_size, page_total_num;//总记录数,每页条数,总页数
function getData(page) { //获取当前页数据
$.ajax({
type: 'GET',
url: 处理数据地址,
data: {
'page': page,
'catid': '{$video_info.catid}'
},
dataType: 'json',
success: function(json) {
$("#ul_lists").empty();
total_num = json.total_num; //总记录数
page_size = json.page_size; //每页数量
page_cur = page; //当前页
page_total_num = json.page_total_num; //总页数
var li = "";
var list = json.list;
$.each(list,
function(index, array) { //遍历返回json
var curid = {$video_info.id};
var cur = curid == array['id'] ? "class='cur'" : "";
li += "<li "+cur+"><a href='地址/id/"+array['id']+"'>" + array['title'] + "</a><span>"+array['time']+"</span></li>";
});
$("#ul_lists").append(li);
},
complete: function() {
getPageBar(); //js生成分页,可用程序代替
},
error: function() {
alert("数据异常,请检查是否json格式");
}
});
}
function getPageBar() { //js生成分页
if (page_cur > page_total_num) page_cur = page_total_num; //当前页大于最大页数
if (page_cur < 1) page_cur = 1; //当前页小于1
page_str = "<span>共" + total_num + "条</span><span>" + page_cur + "/" + page_total_num + "</span>";
if(page_total_num > 1){
if (page_cur == 1) { //若是第一页
page_str += "<span>首页</span><span>上一页</span>";
} else {
page_str += "<span><a href='javascript:void(0)' data-page='1'>首页</a></span><span><a href='javascript:void(0)' data-page='" + (page_cur - 1) + "'>上一页</a></span>";
}
if (page_cur >= page_total_num) { //若是最后页
page_str += "<span>下一页</span><span>尾页</span>";
} else {
page_str += "<span><a href='javascript:void(0)' data-page='" + (parseInt(page_cur) + 1) + "'>下一页</a></span><span><a href='javascript:void(0)' data-page='" + page_total_num + "'>尾页</a></span>";
}
}
$("#page").html(page_str);
}
$(function() {
getData(1);//默认第一页
$("#page a").live('click', function() { //live 向未来的元素添加事件处理器,不可用bind
var page = $(this).attr("data-page");//获取当前页
getData(page)
});
});

数据处理端就正常的接收参数查询数据然后返回json前台处理

ajax 分页完全代码整理的更多相关文章

  1. 补充ajax分页的代码

    1.主页代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. ...

  2. Ajax分页js代码

    var pageIndex = 0; var pageSize = 10; $(function () { $("#btnSearch").click(function () { ...

  3. laraver ajax分页

    ,设置分页容器参考laraver手册 我的设置代码如下: ,控制器调用的方法:代码如下 );         include($path);         $content = ob_get_cle ...

  4. 原生ajax分页,无刷新分页,最简化。超简单,代码最少

    <html><script> var page=1; // 页面第一次加载,显示第一页 window.onload=function(){ ajax_go(1) } //分页的 ...

  5. [jQuery]jQuery DataTables插件自定义Ajax分页实现

    前言 昨天在博客园的博问上帮一位园友解决了一个问题,我觉得有必要记录一下,万一有人也遇上了呢. 问题描述 园友是做前端的,产品经理要求他使用jQuery DataTables插件显示一个列表,要实现分 ...

  6. ThinkPHP 整合Bootstrap Ajax分页

    ThinkPHP Ajax分页代码 publicfunction index() { $where=array(); $name = I('name'); if(!empty($name)){ $wh ...

  7. yii2的分页和ajax分页

    要想使用Yii分页类第一步:在控制器层加载分页类 use yii\data\Pagination;第二步: 使用model层查询数据,并用分分页,限制每页的显示条数$data = User::find ...

  8. MvcPager 概述 MvcPager 分页示例 — 标准Ajax分页 对SEO进行优化的ajax分页 (支持asp.net mvc)

    该示例演示如何使用MvcPager最基本的Ajax分页模式. 使用AjaxHelper的Pager扩展方法来实现Ajax分页,使用Ajax分页模式时,必须至少指定MvcAjaxOptions的Upda ...

  9. PHP+jQuery 长文章分页类 ( 支持 url / ajax 分页方式 )

    /* ******* 环境:Apache2.2.8 ( 2.2.17 ) + PHP5.2.6 ( 5.3.3 ) + MySQL5.0.51b ( 5.5.8 ) + jQuery-1.8 **** ...

随机推荐

  1. 解决IE11只能用管理员身份运行的问题

    解决IE11只能用管理员身份运行的问题 IE11 打不开,必须要用管理员身份运行才可以打开,而且重置浏览器这个方法也不奏效. 今天本人也遇到了,上网查找发现是注册表权限的问题,原因尚不明确,安装了或被 ...

  2. VLC的相关文档以及javascript接口

    参看下面链接:VLC相关文档

  3. 学习PrintWriter类 .

    java.io包 1)首先先知道它的八种构造方法,但怎么记住这八种呢?我们都知道PrintWriter是一种过滤流,也叫处理流.也就是能对字节流和字符流进行处理,所以它会有: PrintWriter( ...

  4. display:table-cell的惊天作用,直接惊呆你!

    一 display:table-cell介绍 ... 二 用法 (1)高度不固定元素,垂直居中 ... (2)高度不固定列表元素,登高排列 ... (3)宽度不固定元素,平均分配 ...

  5. TFS2013团队使用纪要

    Team Foundation Server(TFS)是微软推出的团队项目管理工具,主要包含代码版本控制,工作任务分派,持续集成,测试等一系列管理任务. 由于团队之前人数较少,使用的仅有代码版本控制( ...

  6. c++ ifstream ofstream 文件流

    #include <fstream>ofstream //文件写操作 内存写入存储设备 ifstream //文件读操作,存储设备读区到内存中fstream //读写操作,对打开的文件可进 ...

  7. atoi 和itoa用法

    1.itoa 在linux下没有itoa这个函数 原型:char  *itoa(int   value,char   *string,int   radix)                   用法 ...

  8. UESTC_树上的距离 2015 UESTC Training for Graph Theory<Problem E>

    E - 树上的距离 Time Limit: 2000/1000MS (Java/Others)     Memory Limit: 262143/262143KB (Java/Others) Subm ...

  9. UESTC_菲波拉契数制升级版 2015 UESTC Training for Dynamic Programming<Problem L>

    L - 菲波拉契数制升级版 Time Limit: 3000/1000MS (Java/Others)     Memory Limit: 65535/65535KB (Java/Others) Su ...

  10. 借贷宝注册送现金疯转 新闻PS图背后真相

    动动手指,20元人民币立即到手:http://www.cnblogs.com/mfryf/p/4754384.html 近日,九鼎投资旗下投资平台借贷宝开展的“拉上好友抢红包,轻轻松松玩出钱”引起市场 ...