easui Pagination Layout

easui Pagination Layout
分页显示方式有几种
layout: ['first', 'prev', 'next', 'last']
layout: ['list', 'sep', 'first', 'prev', 'sep', 'manual', 'sep', 'next', 'last', 'sep', 'refresh']
layout: ['links']
layout: ['first', 'prev', 'links', 'next', 'last']
layout: ['first', 'prev', 'next', 'last', 'sep', 'links', 'sep', 'manual']

Html
1. <!DOCTYPE html>
2. <html>
3. <head>
4. <meta charset="UTF-8">
5. <title>Pagination Layout - jQuery EasyUI Demo</title>
6. <link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css">
7. <link rel="stylesheet" type="text/css" href="../../themes/icon.css">
8. <link rel="stylesheet" type="text/css" href="../demo.css">
9. <script type="text/javascript" src="../../jquery.min.js"></script>
10. <script type="text/javascript" src="../../jquery.easyui.min.js"></script>
11. </head>
12. <body>
13. <h2>Pagination Layout</h2>
14. <p>The pagination layout supports various types of pages which you can choose.</p>
15. <div style="margin:20px 0;"></div>
16. <div class="easyui-panel">
17. <div id="pp" class="easyui-pagination" data-options="
18. total:114,
19. layout:['first','prev','next','last']
20. "></div>
21. </div>
22. <div style="margin-top:10px">
23. <select onchange="setLayout(this.value)">
24. <option value="1">Previous Next</option>
25. <option value="2">Manual Page Input</option>
26. <option value="3">Numeric Links</option>
27. <option value="4">Previous Links Next</option>
28. <option value="5">Go To Page</option>
29. </select>
30. </div>
31. <script>
32. function setLayout(type){
33. var p = $('#pp');
34. switch(parseInt(type)){
35. case 1:
36. p.pagination({layout:['first','prev','next','last']});
37. break;
38. case 2:
39. p.pagination({
40. layout:['list','sep','first','prev','sep','manual','sep','next','last','sep','refresh'],
41. beforePageText:'Page',
42. afterPageText:'of {pages}'
43. });
44. break;
45. case 3:
46. p.pagination({layout:['links']});
47. break;
48. case 4:
49. p.pagination({layout:['first','prev','links','next','last']});
50. break;
51. case 5:
52. p.pagination({
53. layout:['first','prev','next','last','sep','links','sep','manual'],
54. beforePageText:'Go Page',
55. afterPageText:''
56. });
57. break;
58. }
59. }
60. </script>
61. </body>
62. </html>
相关阅读:
linux中fork（）函数详解（原创！！实例讲解）（转载）
超级课程表原理解析(如何获取网页内容)
MySql中时间类型总结
 android Json详解
 Jsoup解析Html中文文档
 Mysql相关
 Chrome驱动安装问题
 Airtest 网易 UI 自动化工具 Airtest 浅用记录
 关于Airtest的使用探索
 Sublime text 3搭建Python开发环境及常用插件安装
原文地址：https://www.cnblogs.com/huangf714/p/5834122.html