Home > Web Front-end > JS Tutorial > Asp.Net JS method to generate paging strips

Asp.Net JS method to generate paging strips

高洛峰
Release: 2016-12-05 14:56:49
Original
1068 people have browsed it

Code in Default.aspx.cs

protected int pageIndex = 1;
protected int pageSize = 10;
protected int pageCount = 100;
protected string name = string.Empty;
protected void Page_Load(object sender, EventArgs e)
{
 int.TryParse(Request.QueryString["pageIndex"],out pageIndex);
 name=Request.QueryString["name"];
}
Copy after login

Code inDefault.aspx.cs

Content in Body


名称:<input type="text" id="txtName" value="<%=name %>" />
  <div id="PageBar">
Copy after login

Content in JS

<script src="jquery-1.4.1.js" type="text/javascript"></script>
  <script type="text/javascript">
  var pagecount=<%=pageCount %>;
  var pageindex=<%=pageIndex %>;
  var pageSize=<%=pageSize %>;
  $(function(){
    createPageBar(pageindex,pagecount);
  })
 
  //生成分页条
  function createPageBar(pageindex,pageCount){
   //拿到存放分页条的div并清空
   var pageBarObj=$(&#39;#PageBar&#39;);
   pageBarObj.html(&#39;&#39;);
    
    
   //判断给定页码
   if(pageindex<1){
     pageindex=1;
   }
   if(pageindex>pageCount){
     pageindex=pagecount;
   }
 
   //首页与上一页
   $(&#39;<a href="javaScript:void(0)">首页</a> &#39;).appendTo(pageBarObj).click(function(){
     goPage(1);
   });
 
   if(pageindex>1){
     $(&#39;<a href="javaScript:void(0)">上一页</a> &#39;).appendTo(pageBarObj).click(function(){
      goPage(pageindex-1);
     });
   }
    
 
   //数字分页
   var start=pageindex-4;
   if(start<1){
     start=1;
   }
 
   var end=start+9;
   if(end>pagecount){
     end=pagecount;
   }
 
   for(var i=start;i<=end;i++){
    $(&#39; <a href="javascript:void(0)">[&#39;+i+&#39;]</a> &#39;).appendTo(pageBarObj).click(function(){
     goPage(i);
    });
   }
 
 
   //下一页与尾页
   if(pageindex<pagecount){
    $(&#39;<a href="javaScript:void(0)">下一页</a> &#39;).appendTo(pageBarObj).click(function(){
      goPage(pageindex+1);
     });
   }
   $(&#39;<a href="javaScript:void(0)">尾页</a>&#39;).appendTo(pageBarObj).click(function(){
     goPage(pagecount);
   });
 
  }
 
  //去跳转
  function goPage(pageindex){
    var name=$(&#39;#txtName&#39;).val();
    window.location="/Default.aspx?pageindex="+pageindex+"&name="+name;
  }
  </script>
Copy after login


Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template