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 相关文章推荐
表单元素的submit()方法和onsubmit事件应用概述
Feb 01 Javascript
jquery 多行文本框(textarea)高度变化
Jul 03 Javascript
jquery实现带复选框的表格行选中删除时高亮显示
Aug 01 Javascript
JavaScript中圆括号()和方括号[]的特殊用法疑问解答
Aug 06 Javascript
javascript常见用法总结
May 22 Javascript
JavaScript中对JSON对象的基本操作示例
May 21 Javascript
vue实现某元素吸顶或固定位置显示(监听滚动事件)
Dec 13 Javascript
关于vue中 $emit的用法详解
Apr 12 Javascript
详解Ant Design of React的安装和使用方法
Dec 27 Javascript
vue-socket.io跨域问题有效解决方法
Feb 11 Javascript
JS Web Flex弹性盒子模型代码实例
Mar 10 Javascript
easyUI 实现的后台分页与前台显示功能示例
Jun 01 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
php empty函数判断mysql表单是否为空
2010/04/12 PHP
PHP中创建和验证哈希的简单方法实探
2015/07/06 PHP
接收键盘指令的脚本
2006/06/26 Javascript
Jquery 基础学习笔记
2009/05/29 Javascript
JQuery的Ajax中Post方法传递中文出现乱码的解决方法
2014/10/21 Javascript
AngularJS中比较两个数组是否相同
2016/08/24 Javascript
JavaScript模板引擎Template.js使用详解
2016/12/15 Javascript
Bootstrap源码解读导航(6)
2016/12/23 Javascript
vue2 自定义动态组件所遇到的问题
2017/06/08 Javascript
axios+Vue实现上传文件显示进度功能
2019/04/14 Javascript
微信小程序中如何计算距离某个节日还有多少天
2019/07/15 Javascript
typescript nodejs 依赖注入实现方法代码详解
2019/07/21 NodeJs
浅谈Vuex的this.$store.commit和在Vue项目中引用公共方法
2020/07/24 Javascript
Vue实现移动端拖拽交换位置
2020/07/29 Javascript
微信小程序中target和currentTarget的区别小结
2020/11/06 Javascript
解决vue elementUI 使用el-select 时 change事件的触发问题
2020/11/17 Vue.js
python使用锁访问共享变量实例解析
2018/02/08 Python
Python读取数据集并消除数据中的空行方法
2018/07/12 Python
在Mac下使用python实现简单的目录树展示方法
2018/11/01 Python
Python3 使用pillow库生成随机验证码
2019/08/26 Python
关于Python核心框架tornado的异步协程的2种方法详解
2019/08/28 Python
关于python的缩进规则的知识点详解
2020/06/22 Python
LookFantastic丹麦:英国美容护肤精品在线商城
2016/08/18 全球购物
北京捷通华声语音技术有限公司Java软件工程师笔试题
2012/04/10 面试题
信息系统专业个人求职信范文
2013/12/07 职场文书
迟到检讨书500字
2014/02/05 职场文书
《孔子拜师》教学反思
2014/02/24 职场文书
小学端午节活动方案
2014/03/13 职场文书
信息技术毕业生自荐信范文
2014/03/13 职场文书
《记金华的双龙洞》教学反思
2014/04/19 职场文书
群教班子对照检查材料
2014/08/26 职场文书
行政申诉状范文
2015/05/20 职场文书
刑事上诉状范文
2015/05/22 职场文书
车辆安全隐患排查制度
2015/08/05 职场文书
组织委员竞选稿
2015/11/21 职场文书
咖啡厅里的创业计划书
2019/08/21 职场文书