/**
* 分页
* @author chenqionghe
* @param data json数据,包含totalPage,count
* @param page 获取的页数
* @param obj 表格中的对象
* @param funcName 页码点击跳转的函数名,默认为showPage
* @constructor
*/
function Page(data,page,obj,funcName)
{
var funcName = arguments[3] ? arguments[3] : 'showPage';
this.totalPage = data.totalPage; //总页数
this.count = data.count; //总记录数
this.per = data.per; //每页显示多少条
this.nowPage = page; //当前页码
this.per_choose = [5,10,20,50,100]; //每页提供选择显示条数
this.pageStr = function ()
{
if(this.count == 0)
{
return '<tr><td class="pageStr" colspan="'+$(obj).closest('table').find('th').length+'"><span class="rows">没有数据可供显示</span></td></tr>';
}
//根据总的记录数,循环构造翻页字符串
var rollPage = 5;//设置每页显示的提供点击的页数
var offset = Math.ceil((rollPage / 2));
var pageStr = '<tr><td class="pageStr" colspan="'+$(obj).closest('table').find('th').length+'">'; pageStr +='每页显示<select onchange="'+funcName+'(1,this,this.value)">';
$.each(this.per_choose,function(k,v){
var selected = (data.per == v)? 'selected="selected"' : '';
pageStr += '<option '+selected+' value="'+v+'">'+v+'</option>';
});
pageStr += '</select>  ' pageStr += '<a href="javascript:void(0);" class="first" onclick="'+funcName+'(1,this,'+this.per+')">首页</a>';
pageStr += '<span class="rows">共 '+this.count+' 条记录</span>';
pageStr += ' <span class="rows">第'+this.nowPage+'页 </span>';
if(this.totalPage>offset && this.nowPage>offset)
pageStr += '<a href="javascript:void(0);" class="first" onclick="'+funcName+'(1,this,'+this.per+')">首页</a>';
if(this.nowPage > 1)
pageStr += '<a href="javascript:void(0);" class="prev" onclick="'+funcName+'('+(this.nowPage-1)+',this,'+this.per+')">上一页</a>';
var p; //字符页码
for(var i=1; i<=rollPage; i++)
{
if(this.nowPage < offset)
p = i;
else if(this.nowPage + offset > this.totalPage)
p = this.totalPage-offset+i;
else
p = this.nowPage-offset+i;
//拼接字符串
if(p > 0 && p != this.nowPage)
if(p <= this.totalPage)
pageStr += '<a href="javascript:void(0);" class="num" onclick="'+funcName+'('+p+',this,'+this.per+')">'+p+'</a>';
else
break;
else
{
if(this.nowPage > 0 && this.totalPage != 1)
pageStr += '<a class="current" >'+p+'</a>';
} }
if(this.nowPage < this.totalPage)
pageStr += '<a href="javascript:void(0);" class="next" onclick="'+funcName+'('+(this.nowPage+1)+',this,'+this.per+')">下一页</a>';
if(this.totalPage>offset && (this.nowPage+offset)<this.totalPage)
pageStr += '<a href="javascript:void(0);" class="end" onclick="'+funcName+'('+this.totalPage+',this,'+this.per+')">尾页</a>';
pageStr += '  <span class="rows">共'+this.totalPage+'页</span> ';
pageStr += '</td></tr>';
return pageStr;
}
}

自己实现的ajax分页js的更多相关文章

  1. Ajax分页js代码

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

  2. [js开源组件开发]ajax分页组件

    ajax分页组件 我以平均每一周出一个开源的js组件为目标行动着,虽然每个组件并不是很庞大,它只完成某一个较小部分的工作,但相信,只要有付出,总会得到回报的.这个组件主要完成分页的工作. 这张图里显示 ...

  3. MVC - 11(下)jquery.tmpl.js +ajax分页

    继续 mvc-11(上).dto:http://www.cnblogs.com/tangge/p/3840060.html jquery.tmpl.js 下载:http://pan.baidu.com ...

  4. ThinkPHP AJAX分页及JS缓存的应用

    //AJAX分页详见兄弟连PHP项目视频教程22讲35分钟左右 主要实现是需要将分页中的每个链接都改为AJAX请求 //前端缓存技术:基于javascript传输的数据,只要浏览器没关,都保存在内存中 ...

  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. laraver ajax分页

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

  8. 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 **** ...

  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.3.mi ...

随机推荐

  1. CentOS 6.x下wget 下载提示 Unable to locally verify the issuer’s authority 完美解决方案

    CentOS 6.x下wget 下载提示 Unable to locally verify the issuer’s authority 完美解决方案 栏目:Linux 作者:小天 点击: 1,453 ...

  2. dbus 消息和消息总线实例讲解-一

    应用程序A和消息总线连接,这个连接获取了一个众所周知的公共名(记作连接A).应用程序A中有对象A1提供了接口I1,接口I1有方法M1. 应用程序B和消息总线连接,要求调用连接A上对象A1的接口I1的方 ...

  3. 代码之髓读后感——类&继承

    面向对象 语言中的用语并不是共通的,在不同语言中,同一个用语的含义可能会有很大差别. C++的设计者本贾尼·斯特劳斯特卢普对类和继承给予了正面肯定,然而,"面向对象"这个词的发明者 ...

  4. centos 7安装java开发环境

    https://jingyan.baidu.com/article/29697b91660672ab20de3c15.html 自带版本是有问题的~

  5. JVM 字节码(一)字节码规范

    JVM 字节码(一)字节码规范 JVM 学习资源 Java ClassFile 字节码规范(Oracle) Java 虚拟机规范(Java SE 7 中文版) (周志明等译) Java 反编译工具 - ...

  6. java多线程系列12 ConcurrentHashMap CopyOnWriteArrayList 简介

    我们知道 ,hashmap 和 arraylist 是线程不安全的 在多线程环境下有数据安全问题, 当然 我们可以通过Collections的一些方法把他们变成线程安全的, Collections.s ...

  7. STL基础4:deque

    #include <iostream> #include <queue> #include <string> using namespace std; #defin ...

  8. websocket的简单使用

    一 轮询 什么是轮询:设置每一段时间去访问一次服务器,然后服务器返回最新的数据.这样服务器的压力会非常的大,并且还会有延迟.适用于小型程序. 实现:再客户端的页面设置一个定时发送请求的任务,每个这段时 ...

  9. android 获取文本框回车输入

    扫描头开启,并发送回车 txtUsername.setOnEditorActionListener(new OnEditorActionListener() { @Override public bo ...

  10. C#字符串操作方法签名等

    class Program { /// <summary> /// C# 里Main方法不需要public,而且不允许有两个是Main(string[] args)[包括String[] ...