js下通过getList函数实现分页效果的代码


Posted in Javascript onSeptember 17, 2010

用js实现页面的分页:

<table border="0" cellpadding="0" cellspacing="0" width="100%" style="background-color:#D2EBF3;" height="32"> 
<tr><td align="right" bgColor="#f7f7f7" height="36"> 
<a href="javascript:void(0)" onclick="getPage(-1)" style="visibility :visible " id="up">上一页</a> 
<a href="javascript:void(0)" onclick="getPage(1)" style="visibility :visible " id="next">下一页</a> 
<a href="javascript:void(0)" onclick="getPage(0)" style="visibility :visible ">首页</a> 
<a href="javascript:void(0)" onclick="getPage(11)">尾 页</a> 
<form name="form1" id="form2"> 
<select name='PageCtl1_select' id="select" onchange='SD_Web_PageCtlGoOtherPage(this.value);' style="width: 30px"></select> //按下拉显示页数 
</form> 
</td> </tr> 
</table>

getPage()为js函数,如下:
//参数说明:lblPostsCount:总共记录条数,由getActivityCount获得;iPageIndex:全局变量,当前页数 
function getPage(page) 
{ 
if(page==0)//回到首页 
{ 
iPageIndex=1; 
document.form1.PageCtl1_select.options[iPageIndex-1].selected="true"; //下拉框显示第几页,数组从0开始 
getActivityList(1); 
} 
else if(page==11)//回到尾页 
{ iPageIndex=Math.round (lblPostsCount/6); 
document.form1.PageCtl1_select.options[iPageIndex-1].selected="true"; 
getActivityList(iPageIndex); 
} 
else //上一页,下一页 
{ 
iPageIndex=iPageIndex+page; 
if(iPageIndex<=0) //如果是第一页还点上一页,还是保持在第一页 
iPageIndex=1; 
else if(iPageIndex>Math.round (lblPostsCount/6))//如果是最后一页还点下一页,保持在最后一页 
iPageIndex=Math.round (lblPostsCount/6); 
else 
{ 
document.form1.PageCtl1_select.options[iPageIndex-1].selected="true"; 
getActivityList(iPageIndex);//调用List清单 
} 
} 
} 
function getActivityCount() //获取记录条数 
{ 
var variable=['strWhere']; 
var value=new Array(1); 
value[0]="iStatus=2 and iPublic=5"; 
newRequest("getActivityCount",variable,value,getAllActivityCountShow); 
beginRequest(); 
} 
function getAllActivityCountShow() 
{ 
var xmlhttp=xmlHttpRequest; 
  var str=xmlhttp.responseText; 

 var value=GetValue(str,"getActivityCountResult"); 

 lblPostsCount=value; //记录总数 
  document.form1.PageCtl1_select.length=0; //初始下拉框,把页数付给下拉框的value值和text显示; 
for(i=1;i<=Math.round (lblPostsCount/6);i++) 
{ 
var option=document.createElement("option"); 
option.value=i; 
option.text=i; 
document.form1.PageCtl1_select.options.add(option); 
} 
}

按下拉框显示第几页函数:

function SD_Web_PageCtlGoOtherPage(pageNo) 
{ 
getActivityList(pageNo); 
}
Javascript 相关文章推荐
Javascript 面向对象 重载
May 13 Javascript
js对列表中第一个值处理与jsp页面对列表中第一个值处理的区别详解
Nov 05 Javascript
gridview生成时如何去掉style属性中的border-collapse
Sep 30 Javascript
JS基于面向对象实现的放烟花效果
May 07 Javascript
基于js对象,操作属性、方法详解
Aug 11 Javascript
Validform验证时可以为空否则按照指定格式验证
Oct 20 Javascript
vue缓存的keepalive页面刷新数据的方法
Apr 23 Javascript
简单学习5种处理Vue.js异常的方法
Jun 17 Javascript
layui 上传插件 带预览 非自动上传功能的实例(非常实用)
Sep 23 Javascript
uploadify插件实现多个图片上传并预览
Sep 30 Javascript
基于js实现复制内容到操作系统粘贴板过程解析
Oct 11 Javascript
react实现移动端下拉菜单的示例代码
Jan 16 Javascript
前端开发的开始---基于面向对象的Ajax类
Sep 17 #Javascript
基于jquery的仿百度的鼠标移入图片抖动效果
Sep 17 #Javascript
js下用eval生成JSON对象
Sep 17 #Javascript
JS实现在Repeater控件中创建可隐藏区域的代码
Sep 16 #Javascript
Bookmarklet实现启动jQuery(模仿 云输入法)
Sep 15 #Javascript
基于jQuery的淡入淡出可自动切换的幻灯插件打包下载
Sep 15 #Javascript
基于JQuery的简单实现折叠菜单代码
Sep 15 #Javascript
You might like
laravel中Redis队列监听中断的分析
2020/09/14 PHP
JavaScript Undefined,Null类型和NaN值区别
2008/10/22 Javascript
JS往数组中添加项性能分析
2015/02/25 Javascript
JSONP和批量操作功能的实现方法
2016/08/21 Javascript
JavaScript中apply方法的应用技巧小结
2016/09/29 Javascript
微信小程序 详解下拉加载与上拉刷新实现方法
2017/01/13 Javascript
JavaScript实现多叉树的递归遍历和非递归遍历算法操作示例
2018/02/08 Javascript
vue项目中使用ueditor的实例讲解
2018/03/05 Javascript
手写Node静态资源服务器的实现方法
2018/03/20 Javascript
微信小程序3D轮播实现代码
2019/09/19 Javascript
js实现图片上传到服务器和回显
2020/01/19 Javascript
Python的Tornado框架实现异步非阻塞访问数据库的示例
2016/06/30 Python
Python使用flask框架操作sqlite3的两种方式
2018/01/31 Python
分析Python读取文件时的路径问题
2018/02/11 Python
浅谈python连续赋值可能引发的错误
2018/11/10 Python
对python:循环定义多个变量的实例详解
2019/01/20 Python
Python将json文件写入ES数据库的方法
2019/04/10 Python
CentOS7安装Python3的教程详解
2019/04/10 Python
pyinstaller打包多个py文件和去除cmd黑框的方法
2019/06/21 Python
在python中将list分段并保存为array类型的方法
2019/07/15 Python
python 爬取马蜂窝景点翻页文字评论的实现
2020/01/20 Python
Python更换pip源方法过程解析
2020/05/19 Python
HTML5 本地存储和内容按需加载的思路和方法
2011/04/07 HTML / CSS
瑜伽国际:Yoga International
2018/04/18 全球购物
C#公司笔试题
2014/03/28 面试题
人事部专员岗位职责
2014/03/04 职场文书
银行委托书范本
2014/04/04 职场文书
思想道德自我评价2015
2015/03/09 职场文书
离职员工给领导和同事的感谢信
2015/11/03 职场文书
2016年全国爱眼日宣传教育活动总结
2016/04/05 职场文书
毕业生就业推荐表自我鉴定
2019/06/20 职场文书
MYSQL 的10大经典优化案例场景实战
2021/09/14 MySQL
Nginx stream 配置代理(Nginx TCP/UDP 负载均衡)
2021/11/17 Servers
Golang 并发下的问题定位及解决方案
2022/03/16 Golang
MyBatis配置文件解析与MyBatis实例演示
2022/04/07 Java/Android
Windows server 2012搭建FTP服务器
2022/04/29 Servers