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

发布时间 - 2026-01-10 22:56:27    点击率:

jquery.pagination.js插件,此jQuery插件为Ajax分页插件,一次性加载全部数据,故分页切换时无刷新与延迟,只是重写指定dom元素中的html内容,如果数据量较大不建议用此方法,因为加载会比较慢;

jQuery的多数插件使用都比较简单,都能查找出相关api,且含有demo;

使用此插件,首先在页面(jsp、html)中引入其js、css文件

<link href="/自定义路劲/jquery.pagination/pagination.css" rel="external nofollow" rel="stylesheet">
<script src="/自定义路径/jquery.pagination/jquery.pagination.js" type="text/javascript"></script>

具体代码:

<html> 
 <body> 
  <div id="table"> 
   <div id="result"> 
    查询后的数据 
   </div> 
   <!--分页div,使用时,只需此部分即可--> 
   <div class="cl"> 
    <div class="pagination" id="pageDiv"></div><!--id自定义即可--> 
   </div> 
  </div> 
   
 <body> 
 <script> 
  // 创建分页 
  $("#pageDiv").pagination(${p.totalPage}, { 
   num_edge_entries: 1, //两侧显示的首尾分页的条目数 
   num_display_entries: 4, //连续分页主体部分显示的分页条目数 
   callback: function(){//回调函数, 
     //setLinkTo();//自定义函数:某种行为 
   }, 
   link_to: "#",//分页的链接 
   current_page: ${p.pageNo},//当前页 
   prev_text : "< 上一页",//自定义“上一页”标签 
   next_text : "下一页 >",//自定义“下一页”标签 
   first_text: "<i class='begin_page'>首页</i>", //是否显示首页按钮,默认为true; 
   last_text: "<i class='last_page'>末页</i>", //是否显示尾页按钮,默认为true; 
   items_per_page: ${p.pageSize}, //每页显示的条目数(pageSize) 
   toPage: false //是否显示跳转到第几页,默认是true; 
  }); 
 </script> 
</html> 

由于其特有的分页逻辑,使用此插件时,需要谨慎,以免与应用后台的分页逻辑不符,引起不必要的二次开发。

对任何插件的使用都需灵活,取你所需即可:如当我们的应用已经使用了一种前端分页插件,但是喜欢jquery.pagination插件的样式,此时,我们只需使用其样式文件,再对原分页插件源码适当的调整即可。没有必要推翻我们原有的分页逻辑,为了满足插件而使用插件。而一定是为了满足我们而使用插件。

更多精彩内容请点击:jquery分页功能汇总进行学习。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。


# jQuery  # 分页插件  # jquery.pagination.js  # jQuery Pagination Ajax分页插件(分页切换时无刷新与延迟)中文翻译版  # jQuery DataTables插件自定义Ajax分页实例解析  # jquery pagination插件实现无刷新分页代码  # jquery分页插件jquery.pagination.js使用方法解析  # 一款Jquery 分页插件的改造方法(服务器端分页)  # Jquery 分页插件之Jquery Pagination  # jQuery Pagination分页插件使用方法详解  # 分享一个自己动手写的jQuery分页插件  # 快速掌握jquery分页插件jqPaginator的使用方法  # jquery插件pagination实现无刷新ajax分页  # jQuery插件pagination实现分页特效  # jQuery插件simplePagination的使用方法示例  # 分页  # 自定义  # 下一页  # 上一页  # 只需  # 首页  # 默认为  # 加载  # 请点击  # 都能  # 所需  # 每页  # 尾页  # 重写  # 当我们  # 特有的  # 会比  # 于其  # 末页  # 大不 


相关栏目: 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571


相关推荐: Windows驱动无法加载错误解决方法_驱动签名验证失败处理步骤  Laravel怎么实现软删除SoftDeletes_Laravel模型回收站功能与数据恢复【步骤】  Laravel如何实现API速率限制?(Rate Limiting教程)  如何在腾讯云免费申请建站?  海南网站制作公司有哪些,海口网是哪家的?  Laravel如何记录自定义日志?(Log频道配置)  PythonWeb开发入门教程_Flask快速构建Web应用  手机钓鱼网站怎么制作视频,怎样拦截钓鱼网站。怎么办?  JavaScript 输出显示内容(document.write、alert、innerHTML、console.log)  如何为不同团队 ID 动态生成多个“认领值班”按钮  在Oracle关闭情况下如何修改spfile的参数  php 三元运算符实例详细介绍  Laravel如何发送邮件和通知_Laravel邮件与通知系统发送步骤  Laravel如何实现API版本控制_Laravel版本化API设计方案  北京企业网站设计制作公司,北京铁路集团官方网站?  用v-html解决Vue.js渲染中html标签不被解析的问题  为什么php本地部署后css不生效_静态资源加载失败修复技巧【技巧】  Laravel如何使用Blade模板引擎?(完整语法和示例)  Laravel如何生成API文档?(Swagger/OpenAPI教程)  Edge浏览器提示“由你的组织管理”怎么解决_去除浏览器托管提示【修复】  米侠浏览器网页图片不显示怎么办 米侠图片加载修复  Laravel模型关联查询教程_Laravel Eloquent一对多关联写法  Win11怎么更改系统语言为中文_Windows11安装语言包并设为显示语言  深圳防火门网站制作公司,深圳中天明防火门怎么编码?  如何在建站宝盒中设置产品搜索功能?  网站建设要注意的标准 促进网站用户好感度!  Laravel怎么解决跨域问题_Laravel配置CORS跨域访问  Laravel的.env文件有什么用_Laravel环境变量配置与管理详解  简单实现jsp分页  mc皮肤壁纸制作器,苹果平板怎么设置自己想要的壁纸我的世界?  Laravel如何实现用户注册和登录?(Auth脚手架指南)  Laravel Facade的原理是什么_深入理解Laravel门面及其工作机制  黑客如何利用漏洞与弱口令入侵网站服务器?  javascript基本数据类型及类型检测常用方法小结  如何快速生成可下载的建站源码工具?  美食网站链接制作教程视频,哪个教做美食的网站比较专业点?  如何为不同团队 ID 动态生成多个独立按钮  html5audio标签播放结束怎么触发事件_onended回调方法【教程】  java ZXing生成二维码及条码实例分享  Midjourney怎么调整光影效果_Midjourney光影调整方法【指南】  如何用PHP工具快速搭建高效网站?  Laravel 419 page expired怎么解决_Laravel CSRF令牌过期处理  Laravel如何使用Passport实现OAuth2?(完整配置步骤)  Laravel如何实现多级无限分类_Laravel递归模型关联与树状数据输出【方法】  香港代理服务器配置指南:高匿IP选择、跨境加速与SEO优化技巧  装修招标网站设计制作流程,装修招标流程?  如何快速生成高效建站系统源代码?  高防服务器租用首荐平台,企业级优惠套餐快速部署  Laravel怎么配置.env环境变量_Laravel生产环境敏感数据保护与读取【方法】  Laravel如何配置中间件Middleware_Laravel自定义中间件拦截请求与权限校验【步骤】