简单的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 相关文章推荐
javascript比较文档位置
Apr 08 Javascript
使用JQuery FancyBox插件实现图片展示特效
Nov 16 Javascript
sencha ext js 6 快速入门(必看)
Jun 01 Javascript
jQuery解决$符号命名冲突
Jun 18 Javascript
JS实现图片剪裁并预览效果
Aug 12 Javascript
详解探索 vuex 2.0 以及使用 vuejs 2.0 + vuex 2.0 构建记事本应用
Jun 16 Javascript
解决IE7中使用jQuery动态操作name问题
Aug 28 jQuery
基于vue-ssr的静态网站生成器VuePress 初体验
Apr 17 Javascript
jQuery实现基本隐藏与显示效果的方法详解
Sep 05 jQuery
js验证身份证号码记录的方法
Apr 26 Javascript
vue实现简单的日历效果
Sep 24 Javascript
微信小程序 scroll-view 实现锚点跳转功能
Dec 12 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
ThinkPHP让分页保持搜索状态的方法
2014/07/02 PHP
PHP魔术引号所带来的安全问题分析
2014/07/15 PHP
php操作xml入门之xml标签的属性分析
2015/01/23 PHP
php写入数据到CSV文件的方法
2015/03/14 PHP
Laravel 5框架学习之Blade 简介
2015/04/08 PHP
详解WordPress开发中用于获取分类及子页面的函数用法
2016/01/08 PHP
基于jQuery的360图片展示实现代码
2012/06/14 Javascript
JQuery操作Select的Options的Bug(IE8兼容性视图模式)
2013/04/21 Javascript
jquery简单的拖动效果实现原理及示例
2013/07/26 Javascript
Jquery 动态循环输出表格具体方法
2013/11/23 Javascript
jQuery中对未来的元素绑定事件用bind、live or on
2014/04/17 Javascript
JavaScript对象之深度克隆介绍
2014/12/08 Javascript
浅谈JavaScript超时调用和间歇调用
2015/08/30 Javascript
使用Angular.js实现简单的购物车功能
2016/11/21 Javascript
AngularJS中的按需加载ocLazyLoad示例
2017/01/11 Javascript
js实现鼠标拖动功能
2017/03/20 Javascript
vue router动态路由下让每个子路由都是独立组件的解决方案
2018/04/24 Javascript
关于vue状态过渡transition不起作用的原因解决
2019/04/09 Javascript
微信小程序的tab选项卡的实现效果
2019/05/15 Javascript
vue-cli 项目打包完成后运行文件路径报错问题
2019/07/19 Javascript
原生js+ajax分页组件
2020/01/30 Javascript
Python脚本实现网卡流量监控
2015/02/14 Python
Python运算符重载详解及实例代码
2017/03/07 Python
Python字典及字典基本操作方法详解
2018/01/30 Python
Django压缩静态文件的实现方法详析
2018/08/26 Python
使用python3实现操作串口详解
2019/01/01 Python
PyQt5多线程刷新界面防假死示例
2019/12/13 Python
python模式 工厂模式原理及实例详解
2020/02/11 Python
《美丽的田园》教学反思
2014/03/01 职场文书
新农村建设标语
2014/06/24 职场文书
政协会议宣传标语
2014/10/09 职场文书
党员对十八届四中全会的期盼思想汇报范文
2014/10/17 职场文书
党的群众路线教育实践活动调研报告
2014/11/03 职场文书
英语通知范文
2015/04/22 职场文书
python opencv通过4坐标剪裁图片
2021/06/05 Python
MySQL系列之七 MySQL存储引擎
2021/07/02 MySQL