浅谈jQuery Pagination Ajax 分页插件的行使

插件介绍

是插件是jQuery的ajax分页插件。分页切换时无刷新为随便延迟,因为是五次性加载的。假如您用到之插件作分页的时,涉及到之数据量大,提出不用用此插件,因为加载慢会导致用户体验欠好!

插件使用

其一插件使用对比简单。紧要引入以下文件就得为此了 
1.jquery.js依赖库 
2.pagination.css
这首如若体,大家于要素用的时将分页列表放在class类为pagination的竹签内即可

<div class='pagination'></div>

3.jquery.pagination.js 分页的显要骨

参数表达 

图片 1

利用形式

1 $("#Pagination").pagination(pageCount, {
2         num_edge_entries: 2,
3         num_display_entries: 4
4         callback: pageselectCallback,
5         items_per_page:10,
6         prev_text: "<上一页",
7         next_text: "下一页>"
8     });

点代码中的pageCount一般是起后台重回的毕竟的数据条数,也便是您一起有稍许条数。num_dege_entries:2意味首尾两侧分页呈现2单。num_display_entries:4象征的凡接连分页呈现的侧重点数量,item_per_page:每页显示的列表项为10独。callback:pageselectCallback为回调函数。prev_text和next_text为眼前无异页下一致页按钮上之体现文字,默认的口舌是Prev
和 Next。

根本代码和功效亮 

1.效果图

图片 2

2.生死攸关代码

 1 //首次查询: 
 2     offline_mark = keeper_offline("1");
 3     if (offline_mark != false) {
 4         offlinePageMark();//分页查询
 5     }
 6     //--分页
 7     function offlinePageMark(){
 8         $("#offlinePage").pagination(offline_mark,        {
 9             num_edge_entries: 1, //边缘页数     
10             num_display_entries: 5,//主体页数
11             callback: offlinePageCallback,
12             items_per_page: 2, //每页显示2项
13             prev_text: "<上一页",
14             next_text: "下一页>"
15         });
16     }
17 
18     function offlinePageCallback(page_index, jq) {
19         var page_index = parseInt(page_index + 1);
20         keeper_offline(page_index);
21         return false;
22     }
23     function keeper_offline(pageStr){
24         var offline_mark = false;
25         var params={};
26         params.helperId=helperId;
27         params.homeStatus = "offline";
28         params.page = pageStr;      
29         $.ajax({
30                 type: 'post',
31                 dataType: 'json',
32                 async:true,
33                 url: house_keeperURL,
34                 data:{params:JSON.stringify(params)},
35                 success: function (result) {
36                     if (result.retCode=="0000"){
37                         offline_mark = result.pageCount;
38                         //列表内容展示代码集,太多了,就省略了,根据各自需求去展示自己的内容就可以了                                             
39                     }else{                              
40                     }
41                 }
42             })
43             return offline_mark;
44     }

总结: 

jquery pagination
是一个要命好用之分页插件,体现的效能也是能适应多需要的,样式的口舌也得以好去改变其的css就好了。上手太容易。我刚始接触分页的时候,并没用之插件。而是自己去形容的有的共通的艺术,代码也非多。后来,有矣其,我哪怕平素用其了。不过,我前天啊未用它去分页了,现在所以之即是layui的分页插件。虽然还发未知道的童鞋,能够被我留言你的题目。

相关文章