自己实现的ajax分页js
/**
* 分页
* @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的更多相关文章
- Ajax分页js代码
var pageIndex = 0; var pageSize = 10; $(function () { $("#btnSearch").click(function () { ...
- [js开源组件开发]ajax分页组件
ajax分页组件 我以平均每一周出一个开源的js组件为目标行动着,虽然每个组件并不是很庞大,它只完成某一个较小部分的工作,但相信,只要有付出,总会得到回报的.这个组件主要完成分页的工作. 这张图里显示 ...
- MVC - 11(下)jquery.tmpl.js +ajax分页
继续 mvc-11(上).dto:http://www.cnblogs.com/tangge/p/3840060.html jquery.tmpl.js 下载:http://pan.baidu.com ...
- ThinkPHP AJAX分页及JS缓存的应用
//AJAX分页详见兄弟连PHP项目视频教程22讲35分钟左右 主要实现是需要将分页中的每个链接都改为AJAX请求 //前端缓存技术:基于javascript传输的数据,只要浏览器没关,都保存在内存中 ...
- [jQuery]jQuery DataTables插件自定义Ajax分页实现
前言 昨天在博客园的博问上帮一位园友解决了一个问题,我觉得有必要记录一下,万一有人也遇上了呢. 问题描述 园友是做前端的,产品经理要求他使用jQuery DataTables插件显示一个列表,要实现分 ...
- ThinkPHP 整合Bootstrap Ajax分页
ThinkPHP Ajax分页代码 publicfunction index() { $where=array(); $name = I('name'); if(!empty($name)){ $wh ...
- laraver ajax分页
,设置分页容器参考laraver手册 我的设置代码如下: ,控制器调用的方法:代码如下 ); include($path); $content = ob_get_cle ...
- 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 **** ...
- 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 ...
随机推荐
- ORM常用字段介绍
Django中的ORM Django项目使用MySQL数据库 1. 在Django项目的settings.py文件中,配置数据库连接信息: DATABASES = { "default&qu ...
- ABP 权限拦截 第二篇
由于访问人数过多,我今天从新整理一下ABP权限认证机制,帮助大家更容易读懂 1.Abp 的权限拦截主要通过过滤器, public class AbpAuthorizationFilter : I ...
- rabbitmq初学之连接测试
Login was refused using authentication mechanism PLAIN. 用户名或密码没有设置,或者错误
- spring用注解配置,不用XML
//首先装载一个配置类AnnotationConfigApplicationContext context = new AnnotationConfigApplicationContext(MyCon ...
- JavaScript基础视频教程总结(021-030章)
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
- 序列化与Json
序列化: 将数据结构或对象转换成二进制串的过程. 反序列化:将在序列化过程中所生成的二进制串转换成数据结构或者对象的过程. 首先我们通过复制文件举例,这里面就包含序列化与反序列化的过程: public ...
- 根据word模板dotx文件创建word
doc = this._wordApplication.Documents.Add(@"D:\Fdsfsdsfsdfds.dotx"); 用这个会把模板的样式,文字内容都创建到新w ...
- 卷积在图像处理中的应用(转自https://medium.com/@irhumshafkat/intuitively-understanding-convolutions-for-deep-learning-1f6f42faee1)
直观理解深度学习的卷积 探索使他们工作的强大视觉层次 近年来强大且多功能的深度学习框架的出现使得可以将卷积层应用到深度学习模型中,这是一项非常简单的任务,通常可以在一行代码中实现. 然而,理解卷积 ...
- 前端vue框架 父组件与子组件之间的相互调用
子组件调用父组件东西: 1.在父组件与子组件契合的标签的的template模板中绑定 v-bind:自定义一个名字=“要调用的名字” 2.在子组件的script中props:["自定义的名字 ...
- 关不掉的小姐姐程序python tkinter实现 学习---打包教程
首先,我们先准备两个.py文件,还要图片文件 代码//是我自己手写的,copy时记得删掉,不然有可能错误,比如中英文啥的 当然 一些语法的无问题就百度,都能给你答案 第一个.py ...