Bootstrap Paginator 分页插件的使用

2019独角兽企业重金招聘Python工程师标准>>>

由于在给学生上课过程用需要用到分页操作，发现一个比较好用的分页插件，效果如下

插件下载地址：https://github.com/lyonlai/bootstrap-paginator

使用方法：

1、首先要引入必要的css和js文件。

<link type="text/css" rel="stylesheet" href="bootstrap.css">
<script type="text/javascript" src="jquery-3.2.1.js"></script>
<script type="text/javascript" src="bootstrap-paginator.js"></script>

2、写一个div

<div id="example" style="text-align: center"> <ul id="pageLimit"></ul> </div>

3、编写js


$(function(){var currentPage = ${indexData.page.currentPage};var totalPage = ${indexData.page.totalPage};$('#pageLimit').bootstrapPaginator({currentPage : currentPage,totalPages : totalPage,size : "normal",bootstrapMajorVersion : 3,alignment : "right",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) {//TODO具体页面操作}});
});

转载于:https://my.oschina.net/zhengjing/blog/1590942

Bootstrap Paginator 分页插件的使用相关推荐

Bootstrap Paginator分页插件+ajax
Bootstrap Paginator分页插件下载地址: DownloadVisit Project in GitHub Bootstrap分页插件属性介绍: http://www.cnblogs. ...
bootstrap分页插件php,bootstrap paginator分页插件使用方法
Bootstrap Paginator是一款基于Bootstrap的js分页插件,本文主要给大家介绍bootstrap paginator分页插件的两种使用方式,一起看看吧,希望能帮助到大家. 分页有 ...
Bootstrap Paginator 分页插件参数介绍及使用
Bootstrap Paginator是一款基于Bootstrap的js分页插件,功能很丰富,个人觉得这款插件已经无可挑剔了.它提供了一系列的参数用来支持用户的定制,提供了公共的方法可随时获得插件状态 ...
springboot整合bootstrap pagehelper分页插件 mybaties 做多表头表格查询列表
1,页面效果页面html 首先引入js bootstrap bootstrap-table <div style="width:1000px;"> ...
paginatorhelper ajax,Bootstrap Paginator+PageHelper实现分页效果_蓝瞳_前端开发者
最近需要做一个分页,找了挺多的前端分页效果,发现Bootstrap Paginator分页插件效果不错,而我页面也是用BootStrap做的响应式页面,就做了实现一个简单的分页效果. PageHelp ...
分页插件--根据Bootstrap Paginator改写的js插件
刚刚出来实习,之前实习的公司有一个分页插件,和后端的数据字典约定好了的,基本上是看不到内部是怎么实现的,新公司是做WPF的,好像对于ASP.NET的东西不多,导师扔了一个小系统给我和另一个同事,指了两 ...
BootStrap分页插件
BootStrap分页插件官网官方网址:https://labs.pontikis.net/bs_pagination/docs/ 怎么使用引入插件所需要的资源文件 <link href= ...
jQuery分页插件使用
jquery.tabulation.js插件介绍 jquery.tabulation.js是一款兼容bootstrap的jQuery分页插件.该插件可将一组同级元素转换为分页或tabs,提供回调函数, ...
bootstrap mysql分页_bootstrap分页
使用bootstrap分页插件,如下代码是html代码分页编号标题用户 $(function () { var str = ""; var carId = 1; $.ajax( ...

Bootstrap Paginator 分页插件的使用

Bootstrap Paginator 分页插件的使用相关推荐

最新文章

热门文章