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

 更新时间:2010年09月17日 09:35:01   作者:  
js下通过getList函数实现分页效果的代码,需要通过js分页的朋友可以参考下。
用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>&nbsp;//按下拉显示页数
</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);
}

相关文章

  • textarea支持图形编辑的实现方法

    textarea支持图形编辑的实现方法

    本来以为只有iframe支持编辑了,今天突然发现textarea也支持编辑 :( 是不是我太愚钝了? textarea不能用innerHTML来插入html,而用appendChild 这样的话稍微修改下,评论等简单的textarea的表情插入就可以直接显示出来了 而不是只显示emot了 比较实用标题起的确切,但如果叫“现textarea支持编辑”似乎更废话
    2008-03-03
  • javascript与CSS复习(二)

    javascript与CSS复习(二)

    我们接下来讨论元素的可见性,CSS有两种不同的方式可以有效的隐藏元素,它们有各自的特点,会导致不同的结果。
    2010-06-06
  • js监控IE火狐浏览器关闭、刷新、回退、前进事件

    js监控IE火狐浏览器关闭、刷新、回退、前进事件

    本节主要介绍了js监控IE火狐浏览器关闭、刷新、回退、前进事件的方法
    2014-07-07
  • 全面解析Bootstrap图片轮播效果

    全面解析Bootstrap图片轮播效果

    这篇文章主要介绍了全面解析Bootstrap图片轮播效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2015-12-12
  • newxtree.js代码

    newxtree.js代码

    newxtree.js代码...
    2007-03-03
  • echarts饼图扇区添加点击事件的实例

    echarts饼图扇区添加点击事件的实例

    下面小编就为大家带来一篇echarts饼图扇区添加点击事件的实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-10-10
  • Javascript设置对象的ReadOnly属性(示例代码)

    Javascript设置对象的ReadOnly属性(示例代码)

    本篇文章主要介绍了Javascript设置对象的ReadOnly属性(示例代码) 需要的朋友可以过来参考下,希望对大家有所帮助
    2013-12-12
  • 深入理解ES6学习笔记之块级作用域绑定

    深入理解ES6学习笔记之块级作用域绑定

    本篇文章主要介绍了深入理解ES6学习笔记之块级作用域绑定,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-08-08
  • 如何利用JavaScript 实现继承

    如何利用JavaScript 实现继承

    这篇文章主要介绍了如何利用JavaScript 实现继承,JavaScript 在编程语言界是个特殊种类,它和其他编程语言很不一样,JavaScript可以在运行的时候动态地改变某个变量的类型,下面小编将继续介绍JavaScript如何实现继承,需要的朋友可以参考下
    2022-02-02
  • JavaScript实现动态增删表格的方法

    JavaScript实现动态增删表格的方法

    本篇文章主要介绍了JavaScript实现动态增删表格,可以实现表格增加和删除数据的功能,非常具有实用价值,有兴趣的可以了解一下
    2017-03-03

最新评论