jquery分页组件(每页显示多少条)
/**
* 功能说明：jPager 分页插件
* 参数说明：pages:[] 分页的控件个数 @id:显示分页的div ID，@showSelectPage: 是否显示当前分页的条目过滤下拉框
* @currentpage 当前第几页
* @pagesize type：number 每页显示多少条目
* @total type：number 总条数
* @totalpage type：number 总页码数
* */ (function ($) {
'use strict'; $.jPager = function (option) { if (!option || option.totalpage == 0) { for (var i = 0; i < option.pages.length; i++){
$('#'+ option.pages[i].id).empty();
}
return;
} var limitNumber = [20, 30, 50]; var defaultOption = {
pages: [{
id: '',
showSelectPage: true
}],
currentpage: 1, //当前页
pagesize: 20, //一页显示数量
total:1, //条数
totalpage: 1 //总页码
}; var pageObj = $.extend(defaultOption, option); if (pageObj.pages.length == 0) {
return;
} for (var i = 0; i < pageObj.pages.length; i++) {
var obj = pageObj.pages[i];
var _btnId = obj.id;
var _isShowSelect = obj.showSelectPage;
var tpl = '<div class="pager-left">总共 '+ pageObj.total +' 条</div></div><div class="pager-center"><span class="pager">';
if (_isShowSelect) {
tpl += '<span class="count" date-val="'+ pageObj.pagesize +'">'+ pageObj.pagesize +'</span>';
tpl += '<span class="pageCount">';
tpl += '<dl><dt class="open-dt" role-page="role-page" data-val="'+ pageObj.pagesize +'">';
tpl += '<i class="icon-yt-menu-list"></i></dt>';
tpl += '<dd style="display:none" data-val="'+limitNumber[0]+'">'+limitNumber[0]+' <i class="fa fa-check hide"></i></dd>';
tpl += '<dd style="display:none" data-val="'+limitNumber[1]+'">'+limitNumber[1]+' <i class="fa fa-check hide"></i></dd>';
tpl += '<dd style="display:none" data-val="'+limitNumber[2]+'">'+limitNumber[2]+' <i class="fa fa-check hide"></i></dd>';
tpl += '</dl></span>';
} tpl += '<span class="firstPage hide"><i class="fa fa-angle-double-left"></i></span><span class="pageContainer">'; var _pages = [];
if (pageObj.totalpage > 5) { if (pageObj.currentpage <= 3) {
_pages = [1, 2, 3, 4, 5];
} else if (pageObj.currentpage > 3 && (pageObj.totalpage - pageObj.currentpage >= 2)){
_pages[0] = pageObj.currentpage - 2;
_pages[1] = pageObj.currentpage - 1;
_pages[2] = pageObj.currentpage;
_pages[3] = pageObj.currentpage + 1;
_pages[4] = pageObj.currentpage + 2;
}else if (pageObj.currentpage > 3 && (pageObj.totalpage - pageObj.currentpage == 0)){
_pages[0] = pageObj.currentpage - 4;
_pages[1] = pageObj.currentpage - 3;
_pages[2] = pageObj.currentpage - 2;
_pages[3] = pageObj.currentpage - 1;
_pages[4] = pageObj.currentpage;
}else if (pageObj.currentpage > 3 && (pageObj.totalpage - pageObj.currentpage == 1)) {
_pages[0] = pageObj.currentpage - 3;
_pages[1] = pageObj.currentpage - 2;
_pages[2] = pageObj.currentpage - 1;
_pages[3] = pageObj.currentpage;
_pages[4] = pageObj.currentpage + 1;
} } else {
for (var j = 0; j < pageObj.totalpage; j++ ) {
_pages[j] = j + 1;
}
} for (var k = 0; k < _pages.length; k++ ) {
tpl += '<span class="page" data-page="page'+ _pages[k] +'">'+ _pages[k] +'</span>';
} tpl += '</span><span class="lastPage hide"><i class="fa fa-angle-double-right"></i></span></span></div>'; var _totalTpl = '<div class="pull-left">'+ pageObj.total +' <span>条数据</span></div>';
var _select = '<select id="goToPage">';
var _sOption = '';
for(var p = 0; p < pageObj.totalpage; p++) {
_sOption += '<option value="'+ (p + 1) +'">'+ (p + 1) +'</option>';
} _select += _sOption + '</select>';
var _gogoPage = '<div class="pager-right">跳转至'+ _select +'页</div>';
if (obj.showTotal) {
tpl = _totalTpl + tpl;
}
$('#'+_btnId).html(tpl+_gogoPage);
$('#goToPage').val(pageObj.currentpage); //设置上一页 、下一页 是否可见
if (pageObj.currentpage == 1) {
if (pageObj.totalpage >1) {
$('.lastPage').removeClass('hide');
}
}else if (pageObj.currentpage > 1) {
if (pageObj.currentpage == pageObj.totalpage) {
$('.firstPage').removeClass('hide');
}else{
$('.firstPage').removeClass('hide');
$('.lastPage').removeClass('hide');
}
} //切换页码
$('#goToPage').unbind().bind('change', function () {
var _val = $(this).val();
var page = {
// limit: $('.pager .count:eq(0)').text().trim(),
page: _val
} obj.callback(page);
}); //点击页码数量
$('.pageCount dd').click(function () { var _hasClass = $(this).children('i').hasClass('hide');
if (!_hasClass) {
return;
} var _text = $(this).text();
var _val = $(this).attr('data-val');
$('.pager .count').text(_text);
$(this).siblings('dd').children('i').addClass('hide');
$(this).children('i').removeClass('hide');
if($('#limit')){
$('#ipt_limit').val(_text);
} var page = {
limit: $('.pager .count:eq(0)').text().trim(),
page: 1
} $('.pageCount dd').slideUp(10, function () {
$(this).siblings('dt').attr('style', '').attr('data-val', _val);
$(this).siblings('dd').children('i').addClass('hide');
});
obj.callback(page);
}); //点击页码
$('span[data-page]').click(function () {
var _hasClass = $(this).hasClass('active'); if (_hasClass) {
return;
} var _page = $(this).attr('data-page');
$('span[data-page]').removeClass('active');
//$(this).addClass('active');
$('span[data-page="'+ _page +'"]').addClass('active');
if($('#ipt_page')){
$('#ipt_page').val(_page);
} var page = {
page: $('.pager:eq(0) .active').text().trim(),
limit: $('.pager .count:eq(0)').text().trim()
}
obj.callback(page);
}); //点击上一页
$('#'+_btnId +' span .firstPage i').bind('click', function () {
var currentPage = parseInt($('.pager:eq(0) .active').text().trim());
if (currentPage == 1) {
$('.firstPage').addClass('hide');
return;
}
var page = {
page: 1,
limit: $('.pager .count:eq(0)').text().trim()
}
obj.callback(page);
}); //点击下一页
$('#'+_btnId +' span .lastPage i').click(function () {
var currentPage = parseInt($('.pager:eq(0) .active').text().trim());
if (currentPage == pageObj.totalpage) {
$('.lastPage').addClass('hide');
return;
}
var page = {
page: pageObj.totalpage,
limit: $('.pager .count:eq(0)').text().trim()
}
obj.callback(page);
});
} //初始化，选中当前页码
$('span[data-page]').removeClass('active');
$('span[data-page="page'+ pageObj.currentpage +'"]').addClass('active'); /* 切换每页条数 */
$('.pageCount dt').click(function() { var _val = $(this).attr('data-val');
$(this).siblings('dd[data-val="'+_val+'"]').children('i').removeClass('hide'); $('dd').slideUp(10, function() {
$('.select-has-border').removeClass('select-has-border-open').children('dd').css('display', 'none');
$('.campaign-query').css('border-radius', '5px');
$('.cp-select').removeClass('cp_select_open');
});
var _isShow = $(this).siblings('dd').css('display') == 'none' ? false : true;
if (_isShow) {
$(this).siblings('dd').hide();//.removeClass('page-Open').addClass('page-Close')
var _css = {
'borderTop': '0px solid #ccc',
'border-top-right-radius': '0px',
'border-top-left-radius': '0px',
'backgroundColor': 'white',
'color': ''
};
$(this).css(_css);
} else {
$(this).siblings('dd').slideDown(10);//.removeClass('page-Close').addClass('page-Open')
var _css = {
'border-top-right-radius': '5px',
'border-top-left-radius': '5px',
'backgroundColor': '#414C59',
'color': 'white'
};
$(this).css(_css);
}
}); };
})(jQuery);
/* 分页 */
.pager{
height: 30px;
line-height: 30px;
padding: 0;
margin-top: 0;
margin-left: 70px;
display: inline-block;
} .pager{
float:left;
} .pager .pageCount{
float:left;
width:60px;
height: 30;
line-height: 30px;
text-align: left;
margin-left: -5px;
text-indent: 5px;
} .pager .count{
padding-top:3px;
float:left;
cursor:default;
} .pager .pageCount dl{
margin: 0;
padding: 0;
width: 60px;
} .pager .pageCount dt>i:first-child{
vertical-align:bottom;
margin-top: 3px;
} .pager .pageCount dd{
background-color: #414C59;
height: 24px;
width:60px;
line-height: 24px;
text-align: left;
text-indent: 5px;
color: white;
border:none;
} .pager .pageCount dd:last-child{
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
} .pager .pageCount dd:hover{
background-color: #333E4D;
} .pager-left{
float:left;
width: 100px;
} .pager-center{
float:left;
width: 340px;
} .pager-right{
float: left;
width: 160px;
} #goToPage{
width:50px;
margin-left: 5px;
margin-right: 5px;
} .pager dt:hover{
color:#2AC3FA;
} .pager .firstPage{
margin-left: 20px;
} .pager .firstPage>i{
margin-top: 5px;
} .pager .page{
margin-left: 5px;
} .pager .lastPage{
margin-left: 10px;
} .pager .lastPage>i{
margin-top: 5px;
} .pager i.little{
font-size:10px;
vertical-align: top;
margin-top: 5px;
margin-left: 2px
} .pager span{
cursor: pointer;
border:1px solid transparent;
} .pager .page{
padding-left: 3px;
padding-right: 5px;
padding-top: 2px;
padding-bottom: 2px;
border-radius: 5px;
} .pager span.active{
background-color: #2AC3FA;
color:white;
padding-left: 5px;
padding-right: 5px;
padding-top: 1px;
padding-bottom: 2px;
border-radius: 5px;
} .pager span.page:hover{
background-color: white;
border:1px solid #2AC3FA;
color:#2AC3FA;
} .pager .lastPage:hover, .pager .firstPage:hover{
color:#2AC3FA;
} .pager .open{
color:#ffffff;
background-color: #414C59;
} .pager span{
display:inline-block;
height: 24px;
line-height: 20px;
margin-left: 2px;
float: left;
} .pager .pageContainer{
display: inline-block;
min-width: 26px;
width: auto;
height: 30px;
line-height: 30px;
overflow:hidden;
}
需要的参数：
aaarticlea/png;base64,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" alt="" />
使用方法：
//分页控件
var option = {
pages: [{
id: 'pageIndex',
showSelectPage: false,
callback: function (option) {
//点击页码回调函数
//goPage(option);
var param = {
'grade_id': $('#addGrade').val(),
'class_id': $('#addClass').val(),
'start_date': $('#startTime').val(),
'end_date': $('#endTime').val(),
'status': $('#foodStatus').val()
}; param = $.extend(param, option);
renderSyllabusIndex(param); //点击页码的回调函数
}
}],
pagesize: _data.pagesize,
total: _data.total,
currentpage: _data.currentpage,
totalpage: _data.totalpage
}; $.jPager(option);
效果：
aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAArwAAAAnCAIAAABi5gy9AAAFm0lEQVR4nO3dP2/bRhzG8byerBz8CvIGCnbRYr0BbxwLrX0B7AtQswYZiKxdhAwGHKAAPThAgUIo0GwdPAQZLFnswH93xzvyeOKRJ/v7AYHYtEJdpPPdw+OPypsCAADAwpulGwAAAC4DoQEAAFghNAAAACuEBgAAYIXQAAAArBAaAACAFUIDAACwQmgAgBflw8dPAW5LvyqYBqEB7u4eT9f3h5/+PLz9/NSzvftyuHk4fv1+Wrq9wKsQ4AwdYJPghtAAR++/PV/d9mWF7vb+2/PSrQZevgBn6ACbBDeEBri4ezyNTQzldvfIegPgV4AzdIBNgpsRoSFP4yhOc2FPlig7hIdKPzA+cDpZEkVRknl9DjRuHo4OieHt56ebh+PSbQdeuABn6ACbBDfjVhryNG4m5r4g4Bga9ttVtNlJu3abqLba7k1/MUsiA2KEH+++DNQxmLar26el2w74kKdxM+5Uw1018GnHP81OddyUDmnWPXaAM3S3SXb/OO+nmxjLMjSYZ2XtzOwSGvbbVRRFUmjYbYSksNtEaqKon0vbiiyhv/njlhjKbem2Az7kaVyOQdVoGae5EhqypB2lxK/bA/SNWCNGNHNo0JyYzcMix4jnpAiXfWgwvZvCj6yio6bbV3lhtdmIHXq/XfWtLjTPXh0wT+P64Fyq8I7QAMjE0BCnaRJFSSKGhnqk7J6BJalm5JQGsDyNxT0D8cI0Q2tOzGYzHBrIDBdi0tDQGLnSsN9ud+WfYmiQ1hns1KmFrudbbyw4/P6j2P1FaMCrolyeqL6tQoNyuqRfZzAMXFmiX801D6rdGVp/Yjad9Xrdv8cQGvrXsFkqDlE4lycKJTSUCw27sq8b8rHarPpJ1P2EiKn1J4aiOCc0CHUsy5wUAQ7yNE4yeegz1TRkSbU7yQrjCq2wbDpm8C0KfWjQnZhNZ71eiylB+VbbpKIoeqeGGcrn4SKIlYZaJzREFjUN9i3FdLRp4Od/T0VRFD9OO/eVht1GeNP329UZuaG5YCVcuQK8MoUGcXqvHyOOVbZr8+r4ph/v5q9pWNeUr4eaJE0N8otAaAiUw+c0aBfL6h/YMPYEzUrD3vDTxmAdBf3OB0NoeP7lzMsTajR0uEYlaYrHqIuFX+WM114hrb5Ksmr6y+oZsTNkiasOQ+wet0gh5Fpm1yRCw+WxCg1VTJCLDqs3d6gkZ4z+mga77s5KwyxmqmmwKoYdQG7AHJrQ0F6QqMdJ3d0TxUANuaGnBhwaCsMaQ2+T1NDQXaZBaCxCQ1Nx030Tm6rg3vsdrW9mUDp0J0OYe3vb26pfKqXaGBObJTScd3Wi1XQGegW8kUJDSQgLuumvWZrtDqsj7kjTHXnBWy61iaGwCg1Kqic0BGowNAhFurqPHil3CCsP3ULh5jCD0aHbofdtHaSxq1eZJM+VllTPSb/zwX9omDQxUNkA3/I0Fu6dTDJh6GymvzyNoyQRLuNKY1Wdawc+rCHglYYeQ7dcVq9A+xkXM7ULo42qaeimXrUmZyAWTH6m1/6KtW2Tj8/Nv174DQ377ar3E0CtkRgwD+EGy5J42tyEBvnkWbw8kee5kDfMXmBo6Lx0RbMIw8gdIv7DKrjwGBqk+yfOQWLAQtT1grZGfODDGuRTL8sPWu727Yv4GOn6RTH/ZnI5MUiEBrjwFRqmqHwEXrmLCA24UIQGuOgNDQNbz2HFGpbBYhYAWgHO0AE2CW4IDXDhKTQAOF+AM3SATYIbQgNc8F9jA8H68PFTgNvSrwqmQWiAi5uHo1touL4/LN12AIAjQgNc3D2e3ELDH/89L912AIAjQgMc/fbP89jE8Ovfx6VbDQBwR2iAu6/fT9f3w8UNV7dP1/cH1hgA4NIRGgAAgBVCAwAAsEJoAAAAVggNAADACqEBAABYITQAAAAr/wOg+UUApZExwQAAAABJRU5ErkJggg==" alt="" />
jquery分页组件(每页显示多少条)的更多相关文章
- Django中使用JS通过DataTable实现表格前端分页，每页显示页数，搜索等功能
Django架构中自带了后端分页的技术,通过Paginator进行分页,前端点击按钮提交后台进行页面切换. 优缺点:后端分页对于数据量大的场景有其优势,但页面切换比较慢. 后端分页python3代码如 ...
- Jquery分页组件
最近工作不是很忙,所以就看看淘宝kissy分页组件源码,感觉代码也不怎么难 容易理解,所以就按照他们的思路自己重新理一遍,来加深自己对他们的理解,同时对他们的分页组件进行一些重构(因为他们分页是做好了 ...
- 百度-设置-搜索设置-每页显示50条-保存设置-打印alert信息-accept确定
一.场景: 代码: #coding:utf-8from selenium import webdriverfrom selenium.webdriver.common.action_chains im ...
- 基于Jquery插件Uploadify实现实时显示进度条上传图片
网址:http://www.jb51.net/article/83811.htm 这篇文章主要介绍了基于Jquery插件Uploadify实现实时显示进度条上传图片的相关资料,感兴趣的小伙伴们 ...
- 第二百零九节，jQuery EasyUI，Pagination(分页)组件
jQuery EasyUI,Pagination(分页)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 Pagination(分页)组件的使 ...
- extjs4 分页工具栏pagingtoolbar的每页显示数据combobox下拉框
var itemsPerPage = 20; var combo; //创建数据源store Ext.define('recordStore', { extend : 'Ext.data.Store' ...
- 【jQuery 分页】jQuery分页功能的实现
自写的jQuery实现分页功能的分页组件: 功能效果如下: 分页组件就是上图中的三部分, 分别放在表格上部 和下部 . 其中, 1>>>页面的代码如下: product.jsp 其 ...
- vue分页组件table-pagebar
之前一直接触都是原始的前端模型,jquery+bootstrap,冗杂的dom操作,繁琐的更新绑定.接触vue后,对前端MVVM框架有了全新的认识.本文是基于webpack+vue构建,由于之前的工作 ...
- django 分页组件
一.仿django分页功能自己实现 urls.py 1 2 3 4 5 6 7 8 9 from django.conf.urls import url from django.contrib i ...
随机推荐
- mfc给对话框添加背景
void CMyProjetDlg::OnPaint() { CPaintDC dc(this);//用于绘制设备的上下文 CRect rect; GetClientRect(&rect); ...
- cx_Oracle库导入失败引起crontab中python程序运行失败，并且无错误提示
今天遇到一个问题: 一个python脚本命令行运行时很正常,放到crontab中就无法工作,日志也没有记录,找了半天,终于发现问题所在. 在脚本最上方,程序如下: #!/usr/local/bin p ...
- 基于粒子群优化的无约束50维Rosenbrock函数求解
基于粒子群优化的无约束50维Rosenbrock函数求解 一.问题重述 无约束50维的Rosenbrock函数可以描述如下: 其中, 0 要求按PSO算法思想设计一个该问题的求解算法. Rosenbr ...
- Locked Treasure
题意: 有一宝箱,宝箱上有一些锁,有n个人,每个人分管一些钥匙(每个锁对应无数个钥匙), 现给出n,m 求问至少需要多少锁才能存在一种钥匙分配方案使得: 1.至少m个人才可以打开锁. 2.任选m个人一 ...
- 技术胖Flutter第四季-23静态资源和项目图片的处理
技术胖Flutter第四季-23静态资源和项目图片的处理 视频地址:https://www.bilibili.com/video/av35800108/?p=24 项目中引用图片静态资源文件 这里就是 ...
- lua中文教程【基本语法】
代码例子:http://www.inf.puc-rio.br/~roberto/book/code.html 注意:没有“:” 1.特点:可扩展.简单.高效.跨平台 2.使用方式:嵌入程序.独立使用. ...
- 2016CCPC东北地区大学生程序设计竞赛【01/03/05/06/08】
吧啦啦啦啦啦啦啦啦啦啦啦能量,ACM,跨!变身!变成一个智障! 04正在酝酿中!!!马上更新!!!!! 01题意:有一个n个点的图,对于任意两个不同的点,他的权值是两个点下标的最小公倍数,求最小生出 ...
- bzoj 4200: [Noi2015]小园丁与老司机【dp+有上下界最小流】
洛谷上有个点死活卡不过去,不知道是哪里写丑了orz 参考:https://www.cnblogs.com/ditoly/p/BZOJ4200.html 从上往下dp,设f为不向左右走直接上去的值,g为 ...
- Flutter中的可滚动列表组件-PageView
PageVIew,可滚动的视图列表组件,而且每一个子组件的大小都和视图窗口大小一样. 属性: controller -> PageController 用于控制视图页面滚动到的位置 childr ...
- 一篇文章彻底弄懂CAS实现SSO单点登录原理
1. CAS 简介 1.1. What is CAS ? CAS ( Central Authentication Service ) 是 Yale 大学发起的一个企业级的.开源的项目,旨在为 Web ...