简单的js分页脚本


Posted in Javascript onMay 21, 2009
<%@ Page Language="C#" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<script runat="server"> 
</script> 
<html xmlns="http://www.w3.org/1999/xhtml" > 
<head runat="server"> 
<title>无标题页</title> 
<script language="javascript" type="text/javascript" > 
function showpage(url,num,c_p) 
{ 
var prev=0;var next=0;var temp=0;var html=""; 
if(parseInt(c_p+3)>num) 
{ 
prev=num; 
} 
else 
{ 
prev=parseInt(c_p+3); 
} 
temp=10-(prev-c_p); 
if(c_p-temp>0) 
{ 
next=c_p-temp; 
} 
else 
{ 
next=1; 
} 
//如果显示的第一页<10,总页数又大于10 
if(c_p+3<10&&num>c_p+3) 
{ 
for(j=1;j<=10-(c_p+3);j++) 
{ 
prev++; 
} 
} 
if(c_p!=num) 
{ 
html+="<a href='"+url+"index="+(1+c_p)+"'>上一页</a>"+" "; 
} 
for (i=prev;i>=next;i--) 
{ 
if (i==c_p) 
{ 
html+="<font color=red>"+i+" </font>"; 
} 
else 
{ 
html+="<a href='"+url+"index="+i+"'>"+i+"</a>"+" "; 
} 
} 
if(c_p!=1) 
{ 
html+="<a href='"+url+"index="+(c_p-1)+"'>下一页</a>"+" "; 
} 
document.getElementById("pagenumber").innerHTML=html+" 转到<input id=\"page\" style=\"width: 33px\" />页 <input type=\"button\" value=\"go\" onclick=\"funcGo()\" />"; 
} 
function funcLoad() 
{ 
var num=100; 
var url="testpager.html?"; 
var index ; 
index = getUrlParam("index"); 
if(index==0) 
{ 
index=num; 
} 
showpage(url,num,index); 
} 
function getUrlParam(name) 
{ 
var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); 
var r = window.location.search.substr(1).match(reg); 
if (r!=null) 
{ 
return parseInt(unescape(r[2])); 
} 
return 0; 
} 
function funcGo() 
{ 
var num=100; 
if(parseInt(document.getElementById("page").value)>0&&parseInt(document.getElementById("page").value)<=num) 
{ 
window.location.href="testpager.html?index="+parseInt(document.getElementById("page").value); 
} 
else 
{ 
alert("页码不存在!"); 
return false; 
} 
} 
</script> 
</head> 
<body onload="funcLoad(0)"> 
<form id="form1" runat="server"> 
<div id="pagenumber"> 
</div> 
</form> 
</body> 
</html>
Javascript 相关文章推荐
使用Modello编写JavaScript类
Dec 22 Javascript
js弹出层永远居中实现思路及代码
Nov 29 Javascript
javascript实现tab响应式切换特效
Jan 29 Javascript
ES2015 Symbol 一种绝不重复的值
Dec 25 Javascript
微信小程序 input输入框详解及简单实例
Jan 10 Javascript
详解在Vue中通过自定义指令获取dom元素
Mar 04 Javascript
微信小程序上滑加载下拉刷新(onscrollLower)分批加载数据(一)
May 11 Javascript
微信小程序实现漂亮的弹窗效果
May 26 Javascript
vue 兄弟组件的信息传递的方法实例详解
Aug 30 Javascript
layui框架与SSM前后台交互的方法
Sep 12 Javascript
何时/使用 Vue3 render 函数的教程详解
Jul 25 Javascript
vue接通后端api以及部署到服务器操作
Aug 13 Javascript
input+select(multiple) 实现下拉框输入值
May 21 #Javascript
一些Javascript的IE和Firefox(火狐)兼容性的问题总结及常用例子
May 21 #Javascript
Javascript 兼容firefox的一些问题
May 21 #Javascript
鼠标经过的文本框textbox变色
May 21 #Javascript
jQuery 性能优化指南(3)
May 21 #Javascript
jQuery 性能优化指南(2)
May 21 #Javascript
jQuery 性能优化指南 (1)
May 21 #Javascript
You might like
杏林同学录(八)
2006/10/09 PHP
php 连接mysql连接被重置的解决方法
2011/02/15 PHP
php实现字符串反转输出的方法
2015/03/14 PHP
利用Homestead快速运行一个Laravel项目的方法详解
2017/11/14 PHP
javascript 面向对象编程 function也是类
2009/09/17 Javascript
Jquery下EasyUI组件中的DataGrid结果集清空方法
2014/01/06 Javascript
Three.js快速入门教程
2016/09/09 Javascript
node.js实现复制文本到剪切板的功能
2017/01/23 Javascript
JS实现css hover操作的方法示例
2017/04/07 Javascript
vue2 前端搜索实现示例
2018/02/26 Javascript
在Vue项目中引入腾讯验证码服务的教程
2018/04/03 Javascript
微信小程序开发之转发分享功能
2019/10/22 Javascript
js实现简单图片拖拽效果
2021/02/22 Javascript
Python实现Windows上气泡提醒效果的方法
2015/06/03 Python
用python的requests第三方模块抓取王者荣耀所有英雄的皮肤实例
2017/12/14 Python
python修改list中所有元素类型的三种方法
2018/04/09 Python
python贪婪匹配以及多行匹配的实例讲解
2018/04/19 Python
tensorflow实现简单逻辑回归
2018/09/07 Python
python pygame实现2048游戏
2018/11/20 Python
python中yield的用法详解——最简单,最清晰的解释
2019/04/04 Python
Python 面向对象之封装、继承、多态操作实例分析
2019/11/21 Python
利用python下载scihub成文献为PDF操作
2020/07/09 Python
python语言实现贪吃蛇游戏
2020/11/13 Python
matplotlib实现数据实时刷新的示例代码
2021/01/05 Python
open_basedir restriction in effect. 原因与解决方法
2021/03/14 PHP
乌克兰的第一家手表店:Deka
2020/03/05 全球购物
DC Shoes俄罗斯官网:美国滑板鞋和服饰品牌
2020/08/19 全球购物
教育孩子心得体会
2014/01/01 职场文书
中学生打架检讨书
2014/02/10 职场文书
入党自荐书范文
2014/03/09 职场文书
新闻专业毕业生求职信
2014/08/08 职场文书
三方股东合作协议书
2014/10/28 职场文书
2014年变电站工作总结
2014/12/19 职场文书
2015年前台个人工作总结
2015/04/03 职场文书
2019如何书写演讲稿?
2019/07/01 职场文书
如何设置多台电脑共享打印机?多台电脑共享打印机的方法
2022/04/08 数码科技