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);
}

相关文章

  • JS Object.preventExtensions(),Object.seal()与Object.freeze()用法实例分析

    JS Object.preventExtensions(),Object.seal()与Object.freeze()用

    这篇文章主要介绍了JS Object.preventExtensions(),Object.seal()与Object.freeze()用法,结合实例形式分析了javascript控制对象扩展、密封、冻结等相关函数与操作技巧,需要的朋友可以参考下
    2018-08-08
  • 更优雅的微信小程序骨架屏实现详解

    更优雅的微信小程序骨架屏实现详解

    这篇文章主要介绍了更优雅的微信小程序骨架屏实现详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2019-08-08
  • javascript中活灵活现的Array对象详解

    javascript中活灵活现的Array对象详解

    本文的内容就如同标题一样,这篇文章将会灵活的运行Array对象的一些方法来实现看上去较复杂的应用。相信对大家学习或者理解javascript中的Array对象能具有一定的参考借鉴价值,有需要的朋友们下面跟着小编一起来学习学习吧。
    2016-11-11
  • layui 弹出层回调获取弹出层数据的例子

    layui 弹出层回调获取弹出层数据的例子

    今天小编就为大家分享一篇layui 弹出层回调获取弹出层数据的例子,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2019-09-09
  • JSONP解决JS跨域问题的实现

    JSONP解决JS跨域问题的实现

    这篇文章主要介绍了JSONP解决JS跨域问题的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-05-05
  • JavaScript中this机制是如何真正工作的

    JavaScript中this机制是如何真正工作的

    JavaScript中this机制提供了更优雅的方式来隐含地“传递”一个对象引用,导致更加干净的API设计和更容易的复用,this既不是函数自身的引用,也不是函数词法作用域的引用,this实际上是在函数被调用时建立的一个绑定,它指向什么是完全由函数被调用的调用点来决定的
    2023-11-11
  • JavaScript实现继承的6种常用方式总结

    JavaScript实现继承的6种常用方式总结

    JavaScript想实现继承的目的:重复利用另外一个对象的属性和方法。本文为大家总结了JavaScript实现继承的6种常用方式,需要的可以参考一下
    2022-07-07
  • js使用oclif开发命令行工具实现批量修改文件名

    js使用oclif开发命令行工具实现批量修改文件名

    前端开发工作中常用的很多CLI命令相信大家已经很熟悉了,很方便很实用,能够快速帮助你创建项目,快速执行某些重复性操作,下面我们就来学习一下如何使用CLI命令批量修改文件名吧
    2023-12-12
  • 利用JS实现机器人总动员小游戏

    利用JS实现机器人总动员小游戏

    这篇文章主要介绍了如何利用HTML+CSS+JS编写一个机器人总动员小游戏,代码简单易懂对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2022-11-11
  • JS 文件传参及处理技巧分析

    JS 文件传参及处理技巧分析

    其实为js文件传参是很久就接触过的一个问题,只是一直没有放在心上,今天在无忧看到又有人问这个问题,今日总结一下。
    2010-05-05

最新评论