当前位置:   article > 正文

模板分页封装

模板分页封装

 

  1. var ajaxCommFunPage = function(url, data, callback) {
  2. jQuery.ajax({
  3. type : "post",
  4. async: false,
  5. //dataType:'html',
  6. url : url,
  7. timeout: 30000,
  8. data : data,
  9. success : callback
  10. });
  11. };
  12. var asyncSubmit = function(formId){
  13. var formObj = $('#'+formId);
  14. var asyncFlag = formObj.find("input[name='asyncFlag']").val();
  15. var prefix = formObj.find("input[name='alias']").val();
  16. var replaceId = formObj.find("input[name='replaceId']").val();
  17. $('#currentPageHid_'+prefix).val(1);
  18. if(asyncFlag=='true'){
  19. var url = getContextPath() + formObj.attr('action');
  20. ajaxCommFunPage(url, formObj.serialize(), function(str){
  21. var ss = $(str).find('#'+replaceId).html();
  22. $('#'+replaceId).html(ss);
  23. });
  24. }else{
  25. formObj.submit();
  26. }
  27. };
  28. var search = function(json,currentPage, pageSize) {
  29. var formId = json["formId"];
  30. var asyncFlag = json["asyncFlag"];
  31. var prefix = json["prefix"];
  32. var replaceId = json["replaceId"];
  33. if(replaceId == null){
  34. replaceId = json["formId"];
  35. }
  36. $('#currentPageHid_'+prefix).val(currentPage);
  37. $('#pageSizeHid_'+prefix).val(pageSize);
  38. var formObj = $("#"+formId);
  39. var url = getContextPath() + formObj.attr('action');
  40. if(asyncFlag){
  41. ajaxCommFunPage(url, formObj.serialize(), function(str){
  42. var ss = $(str).find('#'+replaceId).html();
  43. $("#"+replaceId).html(ss);
  44. });
  45. }else{
  46. formObj.submit();
  47. }
  48. };
  49. function initPageTab(json){
  50. var formId = json["formId"];//form表单的Id
  51. var divId = json["divId"];//form表单内分页标签的DIVId
  52. var asyncFlag = json["asyncFlag"];//刷新,无刷新标志
  53. var prefix = json["prefix"];//分页标签的标志
  54. var currentPage = json["currentPage"];//当前页
  55. var totalPage = json["totalPage"];//一共多少页
  56. var count = json["count"];//总数
  57. var pageSize = json["pageSize"];//每页多少条
  58. var replaceId = json["replaceId"];//需要替换的ID
  59. if(replaceId == null){
  60. replaceId = json["formId"];
  61. }
  62. //初始化页面
  63. var str = $('#'+divId).html();
  64. str = str.replace(/currentPageAlias/g,currentPage);
  65. str = str.replace(/totalPageAlias/g,totalPage);
  66. str = str.replace(/countAlias/g,count);
  67. str = str.replace(/pageSizeAlias/g,pageSize);
  68. str = str.replace(/asyncFlagAlias/g,asyncFlag);
  69. str = str.replace(/aliasAlias/g,prefix);
  70. str = str.replace(/replaceIdAlias/g,replaceId);
  71. str = str.replace(/prefix/g,prefix);
  72. $('#'+divId).html(str);
  73. //绑定事件
  74. $('#firstPage_'+prefix).delegate(this,'click', function() {
  75. firstPage(json,1,pageSize);
  76. });
  77. $('#prePage_'+prefix).delegate(this,'click', function() {
  78. prePage(json,currentPage,totalPage,pageSize);
  79. });
  80. $('#nextPage_'+prefix).delegate(this,'click', function() {
  81. nextPage(json,currentPage,totalPage,pageSize);
  82. });
  83. $('#finalPage_'+prefix).delegate(this,'click', function() {
  84. finalPage(json,totalPage,pageSize);
  85. });
  86. $('#finalPage_'+prefix).delegate(this,'click', function() {
  87. finalPage(json,totalPage,pageSize);
  88. });
  89. $('#goToCurrPageBtn_'+prefix).delegate(this,'click', function() {
  90. goToCurrPageBtn(json,pageSize,totalPage);
  91. });
  92. $('#currPageIpt_'+prefix).delegate(this,'keypress', function(event) {
  93. if(event.keyCode == "13")
  94. {
  95. goToCurrPageBtn(json,pageSize,totalPage);
  96. }
  97. });
  98. };
  99. var prePage = function(json,currentPage, totalPage, pageSize) {
  100. if (currentPage <= 1) {
  101. currentPage = 1;
  102. } else {
  103. currentPage = currentPage - 1;
  104. }
  105. search(json,currentPage, pageSize);
  106. };
  107. var nextPage = function(json,currentPage, totalPage, pageSize) {
  108. if (currentPage >= totalPage) {
  109. currentPage = totalPage;
  110. } else {
  111. currentPage = currentPage + 1;
  112. }
  113. search(json,currentPage, pageSize);
  114. };
  115. var firstPage = function(json,currentPage, pageSize) {
  116. search(json,currentPage, pageSize);
  117. };
  118. var finalPage = function(json,currentPage, pageSize) {
  119. search(json,currentPage, pageSize);
  120. };
  121. var goToCurrPageBtn = function(json,pageSize, totalPage) {
  122. var prefix = json["prefix"];
  123. var currPageIptObj = $("#currPageIpt_"+prefix);
  124. var currPageIpt = currPageIptObj.val();
  125. if (currPageIpt == "") {
  126. currPageIptObj.val("");
  127. win.msg.short("请输入跳转页数!", "W01");
  128. } else if (parseInt(currPageIpt) > totalPage) {
  129. currPageIptObj.val("");
  130. win.msg.short("你输入的页数超出总页数,请输入正确的页数!", "W01");
  131. } else if (parseInt(currPageIpt) <= 0) {
  132. currPageIptObj.val("");
  133. win.msg.short("你输入的页数小于1,请输入正确的页数!", "W01");
  134. } else {
  135. search(json,parseInt(currPageIpt), pageSize);
  136. }
  137. };

 

 

   

  1. <a href="javascript:void(0);" id="firstPage_prefix">首页</a>
  2. <a href="javascript:void(0);" id="prePage_prefix">上一页</a>
  3. <a href="javascript:void(0);" id="nextPage_prefix">下一页</a>
  4. <a href="javascript:void(0);" id="finalPage_prefix">末页</a>
  5. <span>当前<i>currentPageAlias</i>/totalPageAlias页</span>
  6. <span>共<i>countAlias</i>条记录</span>
  7. <span>pageSizeAlias条记录/页</span>
  8. <span>
  9. 转到<input id="currPageIpt_prefix" type="text" value="currentPageAlias" class="pageTxt" />
  10. <a href="javascript:void(0);" id="goToCurrPageBtn_prefix" class="pageBut">跳转</a>
  11. </span>
  12. <input id="currentPageHid_prefix" type="hidden" name="currentPage" value="currentPageAlias" class="pageTxt" />
  13. <input id="pageSizeHid_prefix" type="hidden" name="pageSize" value="pageSizeAlias" class="pageTxt" />
  14. <input id="asyncFlagHid_prefix" type="hidden" name="asyncFlag" value="asyncFlagAlias" class="pageTxt" />
  15. <input id="aliasHid_prefix" type="hidden" name="alias" value="aliasAlias" class="pageTxt" />
  16. <input id="replaceId_prefix" type="hidden" name="replaceId" value="replaceIdAlias" class="pageTxt" />

 

  

  1. <script type="text/javascript">
  2. $(function(){
  3. var json =
  4. {
  5. formId:"form2",
  6. divId:"div2",
  7. asyncFlag:true,
  8. prefix:"2",
  9. currentPage:$!currentPage,
  10. totalPage:$!totalPage,
  11. count:$!count,
  12. pageSize:$!pageSize
  13. };
  14. initPageTab(json);
  15. });
  16. </script>

 

 

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/Gausst松鼠会/article/detail/203706
推荐阅读
相关标签
  

闽ICP备14008679号