一个Bootstrap风格的分页控件，对于喜欢Bootstrap简洁美观和扁平化的同学可以关注jBootstrapPage， 目前jBootstrapPage最新版为V0.1，后续还有更多功能需要完善。

　　　　demo演示地址: http://www.it175.cn/demo/jBootstrapPage/

　　　　

　代码示例:

　　html代码

<html>

<head>

    <link href="jBootsrapPage.css" rel="stylesheet" />

  <script src="jquery-1.10.2.min.js"></script>

  <script src="jBootstrapPage.js"></script>

</head>

<body>

    <div>

        <ul class="pagination"></ul>

    </div>

<body>

</html>

javascript代码调用

　　每页显示多少条数据(pageSize),显示多少个分页按钮(buttons),传入数据总行数(total)即可， 如果需要在选中某一页，然后去请求服务器端，可以在onPageClicked回调函数中完成。

<script type="text/javascript">

$(function(){

    createPage(10, 13, 150);

    function createPage(pageSize, buttons, total) {

        $(".pagination").jBootstrapPage({

            pageSize : pageSize,

            total : total,

            maxPageButton:buttons,

            onPageClicked: function(obj, pageIndex) {

                alert((pageIndex+1)+'页');

            }

        });

    }

});

</script>

源码下载地址：https://github.com/wangwei123/jBootstrapPage

jQuery分页插件jBootstrapPage，一个Bootstrap风格的分页插件的更多相关文章

  1. 一个Bootstrap风格的分页控件

      http://www.cnblogs.com/wangwei123/p/3682626.html 主题 jQueryBootstrap 一个Bootstrap风格的分页控件,对于喜欢Bootstr ...

  2. bootstrap风格的multiselect插件——类似邮箱收件人样式

    在开发颗粒云邮箱的过程中,遇到了一个前端的问题,就是邮箱收件人的那个multiselect的input输入框.不仅能够多选,还要能够支持ajax搜索,把联系人搜索出来.就是类似下面的这个东西: 网上找 ...

  3. [js插件]分享一个文章内容信息提示插件Colortip

    引用 项目中需要一个信息提示的功能,就上网找了一个插件,发现colortip实现比较简单,就定了这个插件. 实现过程 官网:http://tutorialzine.com/2010/07/colort ...

  4. chrome插件-YSlow 一个使用的web性能测试插件

    本文为转载是文章,如作者发现后不愿意,请联系我进行删除 原文链接:http://www.cnblogs.com/wajika/p/6278825.html YSlow的安装: 1.安装 firebug ...

  5. thinkphp结合bootstrap打造个性化分页

    分页功能是web开发中常见的一项功能,也存在很多形式,这里主要讲一下利用thinkPHP框架的page类来打造一款bootstrap风格的分页过程. 首先需要去thinkPHP官网现在其分页扩展类ht ...

  6. [前端插件]Bootstrap Table服务器分页与在线编辑应用总结

    先看Bootstrap Table应用效果: 表格用来显示数据库中的数据,数据通过AJAX从服务器加载,同时分页功能有服务器实现,避免客户端分页,在加载大量数据时造成的用户体验不好.还可以设置查询数据 ...

  7. Bootstrap的js分页插件属性介绍

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

  8. 一款基于Bootstrap的js分页插件bootstrap-paginator使用实例

    Bootstrap Paginator是一款基于Bootstrap的js分页插件,功能很丰富.它提供了一系列的参数用来支持用户的定制,提供了公共的方法可随时获得插件状态的改变,以及事件来监听用户的动作 ...

  9. 基于jquery的bootstrap在线文本编辑器插件Summernote

    Summernote是一个基于jquery的bootstrap超级简单WYSIWYG在线编辑器.Summernote非常的轻量级,大小只有30KB,支持Safari,Chrome,Firefox.Op ...

随机推荐

  1. Android中利用OpenMax 编程的基本流程

    近期因为公司在做数字电视,播放器和模块由供应商打包一起卖,驱动调通了,但是播放器要硬件解码,和平台差异,原厂又没有相关文档,就自己试着看了一个系统的播放器流程,顺便整理了一下,也方便以后查询,希望对播 ...

  2. Ubuntu vim+ ctags(包含系统函数) + taglist 配置 分类： vim ubuntu 2015-06-09 18:19 195人阅读 评论(0) 收藏

    阅读大型代码,我们经常需要打开很多的代码文件,搜索各种定义.windows下用惯了ide的朋友,转战Linux的时候可能会觉得很难受,找不到合适的阅读工具.其实万能的vim就可以实现.下面介绍一下vi ...

  3. oracle4

    分页查询 按雇员的id号升序取出 oracle的分页一共有三种方式 .根据rowid来分   ) ) order by cid desc; 执行时间0.03秒 .按分析函数来分   and rk> ...

  4. typename使用在模板中区分static成员和类型

    16.19 编写函数,接受一个容器的引用,打印容器中的元素,使用容器的size_type和size成员来控制打印元素的循环. 16.20 重写上一题的函数,使用begin和end返回的迭代器来控制循环 ...

  5. Java获取真实的IP地址--转载

    // 获取真实IP的方法() public String getIpAddr() { String ip = request.getHeader("x-forwarded-for" ...

  6. BeanUtils使用概要

    BeanUtils是apache提供的的一个工具类,在很多地方我们都要用到这个类.下面说说这个类的简单用法. 相关的使用细节已经在代码的注释中说明了. @Test public void test5( ...

  7. Android（java）学习笔记176：BroadcastReceiver之 短信发送的广播接收者

    有时候,我们需要开发出来一个短信监听器,监听用户发送的短信记录,下面就是一个案例,这里同样需要使用广播机制. 下面同样是代码示例,MainActivity.java 和  activity_main. ...

  8. Ubuntu安装sar出错Please check if data collecting is enabled in /etc/default/sysstat

    1.安装sysstat apt-get install sysstat 2.安装后无法使用: Cannot open /var/log/sysstat/sa02: No such file or di ...

  9. 程序员带你十天快速入门Python,玩转电脑软件开发（一）

    关注今日头条-做全栈攻城狮,学代码也要读书,爱全栈,更爱生活.提供程序员技术及生活指导干货. 如果你真想学习,请评论学过的每篇文章,记录学习的痕迹. 请把所有教程文章中所提及的代码,最少敲写三遍,达到 ...

  10. SQL多表查询中的分页，字段组合综合实例解析

    原文:http://www.jb51.net/article/28753.htm http://xuzhihong1987.blog.163.com/blog/static/2673158720098 ...