`

jquery.paginate.js 分页插件的使用

jsp 
阅读更多

在JSP页面需要引入样式 style.css    引入js   jquery.js 和 jquery.paginate.js

以及一个id 为pagination的div

<div id="pagination" class="pagination"></div>

需要两个

<input type="hidden" id="maxPage" value="${maxPage }">
<input type="hidden" id="page" value="${page }">

获取action传递过来的参数
js部分:

$(function(){
  var page_index=$("#page").val();
  var maxPage=$("#maxPage").val();
  $("#pagination").paginate({
      count: maxPage,
      start: page_index-1,
      display: 9,
      border: true,
      border_color: "#AAE",//边框的颜色
      text_color: "#15B" ,//页码文字的颜色
      background_color: "#FFFFFF",//页码容器的背景颜色
      border_hover_color: "#AAE",//当鼠标移动到页码上时,容器的边框颜色
      text_hover_color: "#FFFFFF",//当鼠标移动到页码上时,页码文字的颜色
      background_hover_color: "#26B",//当鼠标移动到页码上时,容器的背景颜色
      mouse: "press",//如果为 “press” 那么当鼠标在上一页或下一页上按下的时候,页码将会一直滚动,如果为 “slide” 那么鼠标点击一次页码就会滚动一次
      onChange: function(page_index) {
       location.href = "xxxAction?page=" + page_index+"&maxPage="+maxPage;
      }
  });
 });

分享到:
评论

相关推荐

    jquery.paginate.js

    而jQuery.paginate.js正是一个基于jQuery的轻量级分页插件,其设计简洁、易于使用,能够快速为网页添加高效且美观的分页效果。 一、jQuery.paginate.js核心功能 1. 简单易用:jQuery.paginate.js的核心优势在于其...

    jquery.paginate.js分页插件

    **jQuery Paginate.js 分页插件详解** 在Web开发中,数据展示往往涉及到大量的记录,为了提高用户体验,分页是一种常见的处理方式。`jQuery Paginate.js` 是一个轻量级的jQuery分页插件,它使得在网页上实现美观且...

    含有ajax的分页插件的使用、jquery.paginate.js

    本教程将详细讲解如何使用包含Ajax功能的分页插件——`jquery.paginate.js`,来实现动态加载和搜索功能。 首先,理解`jquery.paginate.js`的基本原理:这个插件基于jQuery库,它允许我们在不刷新整个页面的情况下,...

    jquery.paginate ajax分页

    `jQuery.paginate` 是一个基于 jQuery 的插件,专门用于实现 AJAX 分页功能,它允许用户在不刷新整个页面的情况下加载更多内容。这个插件简化了前端与后端的数据交互,提升了用户体验。 ### 1. jQuery 和 AJAX ...

    无可挑剔的jQuery分页插件jquery.paginate.zip

    1. **使用须知.txt**:这通常会提供插件的基本使用指南,包括如何引入jQuery库和分页插件的JavaScript及CSS文件,以及如何配置插件参数以满足特定需求。例如,如何设置每页显示的条目数量、定义分页样式、添加自定义...

    jquery.pagination.js 下载

    jquery.pagination.js 下载,优秀的jquery分页插件,使用IP代理国外网站下载而来

    jquery.paginate插件源码改造:支持动态分页

    jQuery paginate是一款轻量级的分页插件,它提供了简洁的API和丰富的自定义选项。然而,原版的jQuery paginate可能无法满足所有开发者的需求,特别是对于那些需要动态加载数据的场景。本文将深入探讨如何改造jQuery ...

    分页插件.zip

    2. **引入分页插件**:将`jquery.paginate.js`添加到HTML文件中,通常放在`&lt;/body&gt;`标签之前。 3. **应用样式**:将`jquery.paginate.css`链接到HTML的`&lt;head&gt;`部分,以定义分页按钮的样式。 4. **初始化插件**:在...

    jQuery paginate分页导航插件ajax分页代码

    jQuery paginate 分页插件则是利用jQuery实现的一种高效、易用的分页解决方案。在本篇文章中,我们将深入探讨如何使用jQuery paginate插件来实现ajax分页。 首先,让我们了解jQuery paginate插件的基本概念。该插件...

    应用jquery插件jPaginate的一个分页例子

    通过以上步骤,你就成功地在你的网页中实现了`jPaginate`分页插件的应用。这个插件不仅提供了基本的分页功能,还允许进行高度定制,满足不同项目的需求。无论你是初学者还是经验丰富的开发者,`jPaginate`都是一个...

    jQuery表格列表分页样式代码.zip

    本文将深入探讨如何使用jQuery和相关插件`jquery.paginate.js`来创建具有多种样式的分页效果,并讲解如何设置每页显示数量以及跳转到指定页码的功能。 首先,`jquery.paginate.js`是一款专门用于表格分页的jQuery...

    jquery的分页显示插件

    这里我们将深入探讨一个名为"jQuery Paginate"的分页插件,它能帮助开发者轻松实现页面的分页效果。 ### 插件介绍 jQuery Paginate是一款轻量级的分页插件,它可以快速创建多种风格的分页导航,提供良好的可定制性...

    jquery插件--表格分页

    4. Paginate.js:一个轻量级的分页插件,易于集成,提供了基本的分页功能。 三、使用jQuery实现表格分页 1. 引入jQuery和分页插件:首先需要在HTML文件中引入jQuery库和选择的分页插件CSS/JS文件。 2. 初始化表格...

    jquery分页插件

    **`jquery.paginate.js`** 文件很可能是这个分页插件的主要脚本文件,它包含了分页功能的核心逻辑。开发者需要在HTML页面中引入jQuery库和这个插件文件,然后调用插件方法,配置参数,即可实现分页功能。 **示例...

    五款漂亮的jquery分页插件

    jQuery Paginate是一款轻量级的分页插件,其核心功能在于提供可自定义的分页样式和配置选项。开发者可以通过简单的API设置每页显示的项目数量、页码显示模式(如数字、省略号)等,使分页功能更加灵活。 3. **...

    wPaginatejs一个jQuery分页插件用于简单地设置分页

    **wPaginate.js jQuery分页插件详解** 在网页开发中,当数据量过大时,为了提高用户体验,通常会采用分页的方式展示信息。wPaginate.js 是一款轻量级的jQuery分页插件,它使得在网页上实现分页功能变得极其简单。这...

    多款jQuery分页插件特效.zip

    jQuery,作为一个广泛使用的JavaScript库,提供了丰富的分页插件,使得开发者能够轻松实现功能丰富且效果美观的分页功能。本资源"多款jQuery分页插件特效.zip"包含了多种jQuery分页插件的代码示例,供开发者学习和...

    漂亮的分页插件

    3. `jquery.paginate.js`:这很可能是分页插件的JavaScript源代码,它实现了分页功能。 4. `codrops_back.png` 和 `bg.png`、`about.png`:这些是图片资源,可能用于美化分页组件的外观。 5. `说明.txt`:提供了关于...

    jQuery 分页插件

    jQuery分页插件基于JavaScript库jQuery,通过动态生成HTML代码,实现对大量数据的分页显示。它通常会维护一个当前页数、总页数和每页显示条数的状态,并根据这些参数计算出相应的导航链接。当用户点击分页链接时,...

Global site tag (gtag.js) - Google Analytics