热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

基于jquery实现简单的分页控件_jquery

前台分页控件有很多,这里分享我的分页控件pagination.js1.0版本,该控件基于jquery。先来看一下预览效果:


前台分页控件有很多,这里分享我的分页控件 pagination.js 1.0版本,该控件基于jquery。

先来看一下预览效果:

基于jquery实现简单的分页控件_jquery - 文章图片

默认情况下,点击页码会像博客园一样,在url后面加上"#p页码"。

控件有2个参数需要注意:

1. beforeRender: 在每个页码项呈现前会被调用,参数为页码的jQuery对象。这个时候我们可以在呈现前做一些处理,例如增加自己的属性等。默认情况下,点击页码,会在url后面加上“#p页码”,这样的url并不会刷新页面。如果我们需要刷新页面,例如url为,"default.aspx?index=页码",就可以在这个回调函数里处理。

2. callback: 点击页码触发,参数为整个options。点击页码并不会发起ajax请求,需要自己处理,options.index 就是本次点击的页码。有时候我们的总数可能会变化,callback 可以将 options 参数回传,这里只要重新设置总数,然后 return 即可。

具体看调用例子就明白了。

源代码:




样式:

样式很简单,可以自己调。

.pager{height:30px;line-height:30px;font-size: 12px;margin: 25px 0px;text-align: center;color: #2E6AB1;overflow: hidden;}
.pager a{border:1px solid #9AAFE5;color:#2E6AB1;margin:0px 5px;padding:5px 8px;text-decoration: none;}
.pager a.hover,.pager a.active{background-color:#2E6AB1;border-color:#000080;color:#FFF;}
.pager a.disabled{color:#C8CDD2;cursor:auto;}

使用例子:


pagination.js 1.0 还有可能还有一些不足和bug,我会及时修正。

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


推荐阅读
  • JavaScript 跨域解决方案详解
    本文详细介绍了JavaScript在不同域之间进行数据传输或通信的技术,包括使用JSONP、修改document.domain、利用window.name以及HTML5的postMessage方法等跨域解决方案。 ... [详细]
  • 探讨了在HTML表单中使用元素代替进行表单提交的方法。 ... [详细]
  • 本文介绍了如何通过安装和配置php_uploadprogress扩展来实现文件上传时的进度条显示功能。通过一个简单的示例,详细解释了从安装扩展到编写具体代码的全过程。 ... [详细]
  • 苹果官方在线商店(中国)提供了关于MacBook Pro的详细信息。通过先进的工厂校准技术,新MacBook Pro能够精确地适应多种色彩空间标准,如sRGB、BT.601、BT.709及P3-ST.2084(HDR),确保用户获得最佳视觉效果。 ... [详细]
  • 本文探讨了当通过Nginx访问网站时出现504 Gateway Timeout错误的解决方案,特别是当请求处理时间超过30秒时的情况。文章提供了调整PHP-FPM配置的具体步骤,以延长请求超时时间。 ... [详细]
  • Adversarial Personalized Ranking for Recommendation
    目录概主要内容基础对抗扰动对抗训练细节代码HeX.,HeZ.,DuX.andChuaT.Adversarialpersonalizedrankingforrecommendatio ... [详细]
  • 本文详细介绍了PHP中几个常用的数组回调函数,包括array_filter、array_map、array_walk和array_reduce。通过具体的语法、参数说明及示例,帮助开发者更好地理解和使用这些函数。 ... [详细]
  • 本文探讨了如何使用Scrapy框架构建高效的数据采集系统,以及如何通过异步处理技术提升数据存储的效率。同时,文章还介绍了针对不同网站采用的不同采集策略。 ... [详细]
  • 本文介绍了使用Python和C语言编写程序来计算一个给定数值的平方根的方法。通过迭代算法,我们能够精确地得到所需的结果。 ... [详细]
  • C/C++ 应用程序的安装与卸载解决方案
    本文介绍了如何使用Inno Setup来创建C/C++应用程序的安装程序,包括自动检测并安装所需的运行库,确保应用能够顺利安装和卸载。 ... [详细]
  • 本文介绍了如何利用jQuery实现对网页上多个div元素的显示与隐藏控制,包括基本的toggle方法及更复杂的显示隐藏逻辑。 ... [详细]
  • 本文探讨了如何通过优化 DOM 操作来提升 JavaScript 的性能,包括使用 `createElement` 函数、动画元素、理解重绘事件及处理鼠标滚动事件等关键主题。 ... [详细]
  • 二维码的实现与应用
    本文介绍了二维码的基本概念、分类及其优缺点,并详细描述了如何使用Java编程语言结合第三方库(如ZXing和qrcode.jar)来实现二维码的生成与解析。 ... [详细]
  • 使用Python构建网页版图像编辑器
    本文详细介绍了一款基于Python开发的网页版图像编辑工具,具备多种图像处理功能,如黑白转换、铅笔素描效果等。 ... [详细]
  • 10月19日,限量免费参与IBM云计算大会
    10月19日,限量免费报名参加IBM云计算大会,探索前沿科技,推动商业转型。 ... [详细]
author-avatar
水急送_113
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有