资讯专栏INFORMATION COLUMN

jQuery插件simplePagination的使用_03

NotFound / 706人阅读

摘要:插件的使用正在熟悉项目上的代码,新添加了一个需要,需要对表单进行分页,之前的代码中是有分页的代码的,看了老半天,也没看太明白。

jQuery插件simplePagination的使用

正在熟悉项目上的代码,新添加了一个需要,需要对表单进行分页,之前的代码中是有分页的代码的,看了老半天,也没看太明白。之前的项目比较久远,继续熟悉代码。

simplePagination的使用

HTML页面,

</>复制代码

  1. 可用区渠道引用可用区引用渠道

因为项目里用到EJS--HTML模板,记得在一开始就引用SimplePagination插件,这个比较简单,就不细说了。

JS代码

</>复制代码

  1. var page_count = 0;
  2. // 定义分页的页数
  3. var limit = 0 ;
  4. // 定义分页的条数
  5. var regionLogListFunc = function(pageNumber){
  6. if(pageNumber=== undefined){
  7. pageNumber = 1;
  8. }
  9. // 页数判断和定义
  10. $get("/regionCopyList?page_number="+ pageNumber,function(data,status){
  11. var #### = jQuery("####-##");
  12. // 获取Table中 tbody的id值
  13. var updateRegionlogList = ""
  14. // for in 遍历 对传入的数据进行显示
  15. for (var i in data){
  16. #### +="";
  17. ##### +=""+data[i].##+"";
  18. ##### +=""+data[i].##"";
  19. #### +=""+data[i].##+"";
  20. #### +=""+data[i].##+"";
  21. updateRegionlogList +="";
  22. }
  23. regionPriceList.empty();
  24. // 添加更新的数据
  25. regionPriceList.append(updateRegionlogList);
  26. });
  27. var onPageClick = regionLogListFunc;
  28. // 获取DOM文档ID
  29. jQuery("#pagination").pagination({
  30. item :<%=z###%>, //ejs模板
  31. itemsOnPage :<%=#####t%> ,//ejs模板
  32. cssStyle :"light-theme",
  33. onPageClick :onPageClick,
  34. onInit :regionLogListFunc,
  35. });
  36. });

另外一种写法是

</>复制代码

  1. var page_index;
  2. var itemsOnPage = 1;
  3. $(function() {
  4. $("#pagination").pagination({
  5. items: {$page_count}, 总页数
  6. itemsOnPage: itemsOnPage,
  7. cssStyle: "light-theme",
  8. onInit: changePage, // 初始化函数
  9. onPageClick: changePage //点击时触发函数
  10. });
  11. });
  12. function changePage(page_index,event){
  13. listTable.gotoPage(page_index); //gotoPage函数调用ajax获取数据 填充页面
  14. document.getElementById("pageCurrent").innerHTML=page_index;
  15. return true;
  16. }

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/97924.html

相关文章

  • jQuery插件simplePagination使用-踩坑记_03

    摘要:插件的使用正在熟悉项目上的代码,新添加了一个需要,需要对表单进行分页,之前的代码中是有分页的代码的,看了老半天,也没看太明白。 jQuery插件simplePagination的使用 正在熟悉项目上的代码,新添加了一个需要,需要对表单进行分页,之前的代码中是有分页的代码的,看了老半天,也没看太明白。之前的项目比较久远,继续熟悉代码。 simplePagination的使用 HTML页面...

    罗志环 评论0 收藏0
  • laravel手动创建数组分页

    摘要:目前,无法高效执行使用语句的分页操作。如果你需要在分页结果集中使用,建议你查询数据库并手动创建分页器。手动创建分页如果你想手动创建分页实例并且最终得到一个数组类型的结果,可以根据需求来创建或者实例来实现。 showImg(https://segmentfault.com/img/bVbbGos?w=640&h=400); laravel分页功能: 有几种方法可以对数据进行分页。最简单的...

    acrazing 评论0 收藏0
  • jquery插件【轮播图】历程

    摘要:轮播图插件的任务已经接近尾声,在书写轮播图期间确实有一些小的感触的。 轮播图插件的任务已经接近尾声,在书写轮播图期间确实有一些小的感触的。感兴趣的可以访问我的轮播图的线上地址:轮播图 首先,轮播图插件其实并不是我第一次写,之前也写过,不过那时候是按照别人的思路写下来的,算起来大概有一年了,这次又一次开始轮播图是因为拜读了《单页面Web应用 JavaScript从前端到后端》的这本书的1...

    khlbat 评论0 收藏0
  • jquery插件【轮播图】历程

    摘要:轮播图插件的任务已经接近尾声,在书写轮播图期间确实有一些小的感触的。 轮播图插件的任务已经接近尾声,在书写轮播图期间确实有一些小的感触的。感兴趣的可以访问我的轮播图的线上地址:轮播图 首先,轮播图插件其实并不是我第一次写,之前也写过,不过那时候是按照别人的思路写下来的,算起来大概有一年了,这次又一次开始轮播图是因为拜读了《单页面Web应用 JavaScript从前端到后端》的这本书的1...

    snowLu 评论0 收藏0
  • Datatables表格插件学习

    摘要:是一款表格插件。当你打开服务器模式的时候,每次绘制表格的时候,会给服务器发送一个请求包括当前分页,排序,搜索参数等等。开启服务器模式需要使用和不定时一讲选项,进一步的信息,请参考下面的配置选项。 Datatables 是一款jquery表格插件。它是一个高度灵活的工具,可以将任何HTML表格添加高级的交互功能,可以很方便的实现分页,即时搜索和排序。 一、简单使用 怎样简单地使用Data...

    Lyux 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<