jQuery插件分享之分页插件jqPagination

使用方法：

添加 jQuery 类库、jqPagination 插件的 JS 和 CSS 文件

代码如下:

<link rel="stylesheet" href="jqpagination.css"/>
<script src="jquery-1.6.2.min.js"></script>
<script src="jquery.jqpagination.min.js"></script>

再需要如下HTML

代码如下:

<div class="pagination">
  <a href="#" class="first" data-action="first">«</a>
  <a href="#" class="previous" data-action="previous">‹</a>
  <input type="text" readonly="readonly" data-max-page="40" />
  <a href="#" class="next" data-action="next">›</a>
  <a href="#" class="last" data-action="last">»</a>
</div>

最后初始化插件

代码如下:

$('.pagination').jqPagination({
  link_string : '/?page={page_number}',
  current_page: 5, //设置当前页 默认为1
  max_page : 40, //设置最大页 默认为1
  page_string : '当前第{current_page}页,共{max_page}页',
  paged : function(page) {
      //回发事件。。。
      }
});

赞 (0)

相关推荐

  • jQuery Pagination Ajax分页插件(分页切换时无刷新与延迟)中文翻译版

    jQuery Pagination Ajax分页插件(分页切换时无刷新与延迟)中文翻译版

    原项目地址:http://plugins.jquery.com/project/pagination版本:v1.2源文件下载:英文原版 或中文翻译修改版 一.相关demo 基本demo页面 Ajax demo页面 参数可编辑demo页面二.简介与说明 此jQuery插件为Ajax分页插件,一次性加载,故分页切换时无刷新与延迟,如果数据量较大不建议用此方法,因为加载会比较慢. 原插件CSS不太合理,使用浮动,故无法方便实现左右方向的定位,且未清除浮动,在中文修改版中我对其进行了优化,使其支持tex

  • jQuery Pagination分页插件使用方法详解

    本文实例为大家分享了jQuery Pagination分页插件的具体代码,供大家参考,具体内容如下 一.引用CSS和JS: <link href="/Content/Plugins/jQuery.Pagination_v2.2/pagination.css" rel="external nofollow" rel="stylesheet" type="text/css" /> <script src=&quo

  • Ajax分页插件Pagination从前台jQuery到后端java总结

    Ajax分页插件Pagination从前台jQuery到后端java总结

    困惑了我一段时间的网页分页,今天特地整理了一下我完成不久的项目.下面我要分享下我这个项目的分页代码,前后端通吃.希望前辈多多指教. 一.效果图 下面我先上网页前台和管理端的部分分页效果图,他们用的是一套代码. 二.上代码前的一些知识点 此jQuery插件为Ajax分页插件,一次性加载,故分页切换时无刷新与延迟,如果数据量较大不建议用此方法,因为加载会比较慢. 三.前台代码部分 var pageSize =6; //每页显示多少条记录 var total; //总共多少记录 $(function(

  • jQuery Pagination分页插件_动力节点Java学院整理

    插件简介 此jQuery插件为Ajax分页插件,一次性加载,故分页切换时无刷新与延迟,如果数据量较大不建议用此方法,因为加载会比较慢. 原插件CSS不太合理,使用浮动,故无法方便实现左右方向的定位,且未清除浮动,在中文修改版中我对其进行了优化,使其支持text-align的定位. 使用方法 跟一般的jQuery插件一样,此插件使用也很简单便捷.方法是pagination,例如$("#page").pagination(100); 参数 参数名 描述 参数值 maxentries 总

  • Jquery 分页插件之Jquery Pagination

    Jquery 分页插件之Jquery Pagination

    实用jQuery分页特效插件jquery.pagination.js,基于jQuery实现,可根据pageselectCallback函数callback调用通过ajax调用动态数据,目前的方法是生成JSON数据到JS文件,调用的数据是JSON格式数据,缺点是数据是一次性读出来的,效率会差些,插件支持众多参数的自定义配置功能,还是很不错的,大家可以根据自己的想法进行改进. 有同学问道jquery的简单分页插件,原来有同事写过一个简单[Javascript 使用回调函数的自定义分页插件--自带样式

  • asp.net jquery无刷新分页插件(jquery.pagination.js)

    asp.net jquery无刷新分页插件(jquery.pagination.js)

    采用Jquery无刷新分页插件jquery.pagination.js 实现无刷新分页效果 友情提示:本示例Handler中采用StringBuilder的append方法追加HTML,小数据量可以,但是大数据或是布局常变,建议返回JSON格式的数据,性能和灵活性更好! 1.插件参数列表  2.页面内容: 复制代码 代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Defaul

  • jQuery插件分享之分页插件jqPagination

    使用方法: 添加 jQuery 类库.jqPagination 插件的 JS 和 CSS 文件 复制代码 代码如下: <link rel="stylesheet" href="jqpagination.css"/><script src="jquery-1.6.2.min.js"></script><script src="jquery.jqpagination.min.js">

  • jQuery simplePage+AJAX plus分页插件用法实例

    本文实例讲述了jQuery simplePage+AJAX plus分页插件.分享给大家供大家参考,具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml&q

  • jQuery分页插件jquery.pagination.js使用方法解析

    jquery.pagination.js插件,此jQuery插件为Ajax分页插件,一次性加载全部数据,故分页切换时无刷新与延迟,只是重写指定dom元素中的html内容,如果数据量较大不建议用此方法,因为加载会比较慢: jQuery的多数插件使用都比较简单,都能查找出相关api,且含有demo: 使用此插件,首先在页面(jsp.html)中引入其js.css文件 <link href="/自定义路劲/jquery.pagination/pagination.css" rel=&q

  • 10款非常有用的 Ajax 插件分享

    10款非常有用的 Ajax 插件分享

    1. AJAX-ZOOM 非常强大的一款插件,可用鼠标滚轮进行缩放,360° 旋转,全屏浏览等很多功能,在线演示 2. VerticalSlider 用于显示长列表的很好的方式,以Ajax方式加载,在线演示 3. More plugin 一款实现更多功能的插件,可用于显示更多评论,也可用于显示后面多少篇博文等,在线演示 4. HTML5 drag & drop image file uploader 这是一款实现HTML5拖放上传的插件,在线演示 5. jpaging 一款基于jQuery实现的

  • MyBatisPlus PaginationInterceptor分页插件的使用详解

    MyBatisPlus PaginationInterceptor分页插件的使用详解

    实现 配置插件 来到项目下的applicationContext.xml中配置sqlSessionFactoryBean的地方. <!-- 配置SqlSessionFactoryBean Mybatis提供的: org.mybatis.spring.SqlSessionFactoryBean MP提供的:com.baomidou.mybatisplus.spring.MybatisSqlSessionFactoryBean --> <bean id="sqlSessionFac

  • Mybatis图文并茂讲解分页插件

    Mybatis图文并茂讲解分页插件

    目录 1. Mybatis分页插件 1.1 分页插件介绍 1.2 分页插件的使用 1.3 分页插件的参数获取 1.4 分页插件知识小结 1. Mybatis分页插件 1.1 分页插件介绍 分页可以将很多条结果进行分页显示. 如果当前在第一页,则没有上一页.如果当前在最后一页,则没有下一页. 需要明确当前是第几页,这一页中显示多少条结果. MyBatis分页插件总结 在企业级开发中,分页也是一种常见的技术.而目前使用的 MyBatis 是不带分页功能的,如果想实现分页的 功能,需要我们手动编写 L

随机推荐