Asp.Net之JS生成分页条的方法


Posted in Javascript onNovember 23, 2016

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"];
}

Default.aspx.cs中的代码

Body中的内容

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

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=$('#PageBar');
   pageBarObj.html('');
   
   
   //判断给定页码
   if(pageindex<1){
     pageindex=1;
   }
   if(pageindex>pageCount){
     pageindex=pagecount;
   }

   //首页与上一页
   $('<a href="javaScript:void(0)">首页</a> ').appendTo(pageBarObj).click(function(){
     goPage(1);
   });

   if(pageindex>1){
     $('<a href="javaScript:void(0)">上一页</a> ').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++){
    $(' <a href="javascript:void(0)">['+i+']</a> ').appendTo(pageBarObj).click(function(){
     goPage(i);
    });
   }


   //下一页与尾页
   if(pageindex<pagecount){
    $('<a href="javaScript:void(0)">下一页</a> ').appendTo(pageBarObj).click(function(){
      goPage(pageindex+1);
     });
   }
   $('<a href="javaScript:void(0)">尾页</a>').appendTo(pageBarObj).click(function(){
     goPage(pagecount);
   });

  }

  //去跳转
  function goPage(pageindex){
    var name=$('#txtName').val();
    window.location="/Default.aspx?pageindex="+pageindex+"&name="+name;
  }
  </script>

以上这篇Asp.Net之JS生成分页条的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript 实用的文字链提示框效果
Jun 30 Javascript
Javascript将string类型转换int类型
Dec 09 Javascript
Javascript中的arguments与重载介绍
Mar 15 Javascript
详解JavaScript逻辑And运算符
Dec 04 Javascript
jQuery自定义滚动条完整实例
Jan 08 Javascript
BootStrap 智能表单实战系列(五) 表单依赖插件处理
Jun 13 Javascript
JavaScript实现清空(重置)文件类型INPUT元素值的方法
Nov 17 Javascript
在js中做数字字符串补0(js补零)
Mar 25 Javascript
javascript实现循环广告条效果
Dec 12 Javascript
Vue实现动态添加或者删除对象和对象数组的操作方法
Sep 21 Javascript
Vue基于localStorage存储信息代码实例
Nov 16 Javascript
如何在 Vue 中使用 JSX
Feb 14 Vue.js
javascript判断firebug是否开启的方法
Nov 23 #Javascript
JavaScript表单验证开发
Nov 23 #Javascript
JavaScript实现垂直向上无缝滚动特效代码
Nov 23 #Javascript
分类解析jQuery选择器
Nov 23 #Javascript
概述jQuery的元素筛选
Nov 23 #Javascript
JS实用的带停顿的逐行文本循环滚动效果实例
Nov 23 #Javascript
使用jquery实现的循环连续可停顿滚动实例
Nov 23 #Javascript
You might like
Syphon 虹吸式咖啡壶冲煮–拨动法
2021/03/03 冲泡冲煮
Dedecms常用函数解析
2008/02/01 PHP
PHP CLI模式下的多进程应用分析
2013/06/03 PHP
PHP删除指定目录中的所有目录及文件的方法
2015/02/26 PHP
PHP Try-catch 语句使用技巧
2016/02/28 PHP
CSS心形加载的动画源码的实现
2021/03/09 HTML / CSS
jquery随意添加移除html的实现代码
2011/06/21 Javascript
JavaScript判断一个URL链接是否有效的实现方法
2011/10/08 Javascript
javascript工具库代码
2012/03/29 Javascript
jQuery模拟点击A标记示例参考
2014/04/17 Javascript
Javascript图片上传前的本地预览实例
2014/06/16 Javascript
js判断当页面无法回退时关闭网页否则就history.go(-1)
2014/08/07 Javascript
js阻止事件追加的具体实现
2014/10/15 Javascript
jQuery中parents()方法用法实例
2015/01/07 Javascript
php利用curl获取远程图片实现方法
2015/10/26 Javascript
理解javascript中的严格模式
2016/02/01 Javascript
微信小程序 wx:for的使用实例详解
2017/04/27 Javascript
vue如何在项目中调用腾讯云的滑动验证码
2020/07/15 Javascript
vue 手机物理监听键+退出提示代码
2020/09/09 Javascript
[02:49]DAC2018决赛日TOP5 LGD开启黑暗之门绝杀VP
2018/04/08 DOTA
[01:21]DOTA2 新英雄 森海飞霞
2020/12/18 DOTA
PyCharm安装第三方库如Requests的图文教程
2018/05/18 Python
解决Pycharm下面出现No R interpreter defined的问题
2018/10/29 Python
python pandas消除空值和空格以及 Nan数据替换方法
2018/10/30 Python
django自定义非主键自增字段类型详解(auto increment field)
2020/03/30 Python
pandas apply多线程实现代码
2020/08/17 Python
美国孕妇装品牌:Destination Maternity
2018/02/04 全球购物
澳大利亚家具商店:Freedom
2020/12/17 全球购物
大学本科生的个人自我评价
2013/12/09 职场文书
财务方面个人工作的自我评价
2013/12/28 职场文书
新学期国旗下演讲稿
2014/05/08 职场文书
实验心得体会
2014/09/05 职场文书
导游词之塘栖古镇
2019/12/04 职场文书
Python实战之OpenCV实现猫脸检测
2021/06/26 Python
深入理解margin塌陷和margin合并的解决方案
2021/06/26 HTML / CSS
Java数组与堆栈相关知识总结
2021/06/29 Java/Android