jquery分页插件

本文转载至:http://www.jqueryajax.com/jquery652

今天比大家介绍一个jquery分页插件,那么什么叫QuickPaginate快速分页,这个jquery插件实现就是将需要显示的内容用分页的方法显示,但不是真正意义上的分页,因为QuickPaginate快速分页不需要与服务器端交互,所有的内容已经全部输送到客户端,每次显示部分信息,用分页的形式进行浏览,效果图如 下:
quickpaginate
使用说明
一,需要jQuery库文件QuickPaginate库文件
二,可自定义分页CSS显示效果,如:qp_prev和qp_next

使用实例
一,包含文件部分

  1. <script src=”jquery.js” type=”text/javascript” ></script>
  2. <script src=”jquery.quickpaginate.js” type=”text/javascript” ></script>

二,HTML部分
(1)jQuery插件QuickPaginate实现文本分页功能

  1. <ul id=”biuuu_city_list“>
  2. <li>北京</li>
  3. <li>上海</li>
  4. <li>广州</li>
  5. <li>杭州</li>
  6. <li>长沙</li>
  7. <li>合肥</li>
  8. <li>宁夏</li>
  9. <li>成都</li>
  10. <li>西安</li>
  11. <li>南昌</li>
  12. </ul>
  13. <div id=”biuuu_city“></div>

其中ID为biuuu_city_list的DIV是要实现分页的内容,ID为biuuu_city是显示分页内容,具体看效果图

(2)jQuery插件QuickPaginate实现图片分页功能

  1. <div id=”images“>
  2. <img src=”demo_images/demo1.jpg” width=”200″ height=”133″ alt=”biuuu1″ />
  3. <img src=”demo_images/demo2.jpg” width=”200″ height=”133″ alt=”biuuu2″ />
  4. <img src=”demo_images/demo3.jpg” width=”200″ height=”133″ alt=”biuuu3″ />
  5. </div>
  6. <div id=”images_counter“></div>

三,javascript部分(调用jQuery插件QuickPaginate)

  1. <script type=”text/javascript”>
  2. $(function(){
  3. $(”#biuuu_city_list li“).quickpaginate({ perpage: 4, pager : $(”#biuuu_city“) });
  4. });
  5. $(function(){
  6. $(”#images img“).quickpaginate({ perpage: 1, showcounter: false, pager : $(”#images_counter“) });
  7. });
  8. </script>

jQuery插件QuickPaginate参数详解
perpage表示每页显示数,默认值为6,如上文本实例每页显示4个城市,图片实例每页显示1张图片
pager表示QuickPaginate生成分页HTML代码显示的对象,默认为null,如上:$(”#biuuu_city”)和$(”#images_counter”)
showcounter表示是否显示统计,默认为true
prev表示上一页CSS样式名,默认为qp_next,具体请看QuickPaginate生成的代码图
next表示下一页CSS样式名,默认为qp_prev
pagenumber表示当前页CSS样式名,默认为qp_pagenumber
totalnumber表示总页数CSS样式名,默认为qp_totalnumber
counter表示统计CSS样式名,默认为qp_counter
jQuery插件QuickPaginate快速分页实现javascript分页功能

注意事项
注意默认的QuickPaginate是UTF8编码,同时需要修改部分QuickPaginate的JS库代码,如将prev修改为中文上一页,next修改为中文下一页,其实就是分页样式,上面的参数中大部分都是定义某个部分的样式,因为样式也是非常重要的。

以上实例可知使用jQuery插件QuickPaginate快速分页非常简单,只需要指定内容,指定每页显示数,显示样式,即可实现快速分页功能,在实际应用中,可对菜单、图片等进行分页,非常具有实用性,值得推荐。

点我下载:jQuery插件QuickPaginate快速分页程序
点我查看jQuery插件QuickPaginate快速分面演示

阅读更多
想对作者说点什么? 我来说一句

jQuery分页插件,超强

2009年10月29日 45KB 下载

jquery分页插件-JqueryPagination.zip

2018年05月17日 5KB 下载

分页插件分页

2017年11月08日 34KB 下载

jquery分页插件pagination

2016年02月04日 4KB 下载

没有更多推荐了,返回首页

加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!
关闭
关闭