分页有两种方式:

1. 前台分页:ajax一次请求获取全部数据,适合少量数据(万条数据以下);

$.ajax({
type: "GET",
url: "",//后台接口地址
dataType: "json",
success: function (msg) {
var pages = Math.ceil(msg.data / 5);//data是数据总量
var element = $('#id');//对应ul的id
element.bootstrapPaginator({
bootstrapMajorVersion: 3,//bootstrap版本
currentPage: page,//当前页面
numberOfPages: 5,//一页显示几个按钮(在ul里面生成5个li)
totalPages: pages //总页数
});
}
});

  注意:1. bootstrap3中分页的HTML部分要求使用ul标签;2. 前台写分页算法。

2. 后台分页:发送多次ajax,每次获取指定页数的数据(万条数据以上)。

$('#id').bootstrapPaginator({
bootstrapMajorVersion: 3,//bootstrap版本
currentPage: 1,//当前页码
totalPages: data.cn,//总页数(后台传过来的数据)
numberOfPages: 5,//一页显示几个按钮
itemTexts: function (type, page, current) {
switch (type) {
case "first": return "首页";
case "prev": return "上一页";
case "next": return "下一页";
case "last": return "末页";
case "page": return page;
}
},//改写分页按钮字样
onPageClicked: function (event, originalEvent, type, page) {
$.ajax({
url: '../../interface/xw_zxdt_list.php',
type: 'post',
data: {page: page},
dataType: 'json',
success: function (data) {
tplData(data);//处理成功返回的数据
}
});
}
});

  注意:1. bootstrap3中分页的HTML部分要求使用ul标签;2. 后台写分页算法。

bootstrap-paginator分页插件的两种使用方式的更多相关文章

  1. Bootstrap Paginator分页插件

    Bootstrap Paginator分页插件使用示例 最近做的asp.netMVC项目中需要对数据列表进行分类,这个本来就是基于bootstrap开发的后台,因此也就想着bootstrap是否有分页 ...

  2. Bootstrap Paginator分页插件+ajax 实现动态无刷新分页

    之前做分页想过做淘宝的那个,但是因为是后台要求不高,就Bootstrap Paginator插件感觉还蛮容易上手,所以就选了它. Bootstrap Paginator分页插件下载地址: Downlo ...

  3. Bootstrap Paginator分页插件+ajax

    Bootstrap Paginator分页插件下载地址: DownloadVisit Project in GitHub  Bootstrap分页插件属性介绍: http://www.cnblogs. ...

  4. Bootstrap Paginator分页插件(mark)

    Bootstrap Paginator分页插件

  5. 基于layPage分页插件浅析两种分页方式

    最近在开发过程中经常用到分页,今天挤出些时间来捋一捋自己的经验 在web开发中,一般显示数据列表页时,我们会用到分页控件来显示数据.采用分页一般基于两种不同的需求,一种是数据量不算很大,但是在页面展示 ...

  6. Bootstrap Paginator 分页插件参数介绍及使用

    Bootstrap Paginator是一款基于Bootstrap的js分页插件,功能很丰富,个人觉得这款插件已经无可挑剔了.它提供了一系列的参数用来支持用户的定制,提供了公共的方法可随时获得插件状态 ...

  7. Bootstrap Paginator分页插件使用示例

    最近做的asp.netMVC项目中需要对数据列表进行分类,这个本来就是基于bootstrap开发的后台,因此也就想着bootstrap是否有分页插件呢,或者说是基于jquery支持的分页功能,这样整体 ...

  8. Bootstrap Paginator分页插件的使用

    今天,我为大家带来的一款做得非常优秀的分页插件BootStrap Paginator,他是一款js插件,由于本人也是才刚刚搞出来的,所以暂时对它也不是特别了解,只能大楖告诉大家怎么使用.我这里使用的是 ...

  9. jquery插件的两种形式

    这里总结一下jquery插件的两种形式,一种是通过字面量的形式组织代码,另一种是通过构造函数的方式.下面就两种形式来分析俩个例子. 例子1: ;(function ($,window,document ...

随机推荐

  1. 【java设计模式】【创建模式Creational Pattern】单例模式Singleton Pattern

    //饿汉式:资源利用率较低(无论是否需要都会创建),性能较高(使用前无需判断实例是否存在,可直接使用) public class EagerSingleton{ private static fina ...

  2. 502 VS 504

    本文同时发表在https://github.com/zhangyachen/zhangyachen.github.io/issues/89 首先看一下概念: 502:作为网关或者代理工作的服务器尝试执 ...

  3. Python练习100则--部分概念的没有做

    # coding = utf-8 import math, osfrom random import randint def Binary(): res = int(-1 / 2) res1 = in ...

  4. Golang 网络爬虫框架gocolly/colly 二 jQuery selector

    Golang 网络爬虫框架gocolly/colly 二 jQuery selector colly框架依赖goquery库,goquery将jQuery的语法和特性引入到了go语言中.如果要灵活自如 ...

  5. HTTPS从认识到线上实战全记录

    前言 关于HTTPS,基本上你想知道的都在这里了.本文原标题<HTTPS原理与实践>,下图是本文配套PPT的目录截图: [TOC] 原理篇 认识HTTPS 先说一下,本文可能有些地方由于描 ...

  6. MobaXterm

    MobaXterm又名MobaXVT,是一款增强型终端.X服务器和Unix命令集(GNU/ Cygwin)封装在一个单一的便携式exe文件.MobaXterm可以开启多个终端视窗,以最新的X服务器为基 ...

  7. css实现一行居中显示,两行靠左显示,超过两行以引号省略

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. Java并发之底层实现原理学习笔记

    本篇博文将介绍java并发底层的实现原理,我们知道java实现的并发操作最后肯定是由我们的CPU完成的,中间经历了将java源码编译成.class文件,然后进行加载,然后虚拟机执行引擎进行执行,解释为 ...

  9. 使用C#开发数据库应用系统 习题

    错题积累 1: 2: 3: 4: 5: 6: 7: 8: 9: 10:

  10. Qt创建停靠悬浮窗口

    1.Qt实现窗口停靠和悬浮使用类QDockWidget,它有两个重要方法用来设置停靠特性以及停靠区域, dw1->setFeatures(QDockWidget::DockWidgetMovab ...