在HTML中有时候我们会用到静态分页,一次拿回一定量的数据结果条目,我们会以形如:第2页,共12页  首页 上一页 下一页 尾页 的方式进行静态分页,以下是该种静态分页的代码,供兄弟姐妹们参考。

<div class="page"> <!-- a href="tosearch.jsp" target="_blank" class="blue">更多</a -->

<SCRIPT type="text/javascript">

function createPageHTML(_nPageCount, _nCurrIndex, _sPageName, _sPageExt){   if(_nPageCount == null || _nPageCount<1){     return;   }   var nCurrIndex = _nCurrIndex || 0;   var pre,next,first,last;   if(_nPageCount==1){   first='<span class="blue">首页</span>&nbsp;'; pre='<span class="blue">上一页</span>&nbsp;'; next='<span class="blue">下一页</span>&nbsp;'; last='<span class="blue">尾页</span>&nbsp;'; }else{  if(_nCurrIndex==0){      pre='<span class="blue">上一页</span>&nbsp;';      first='<span class="blue">首页</span>&nbsp;'; next='<a class="blue" href="'+_sPageName+'_' +(nCurrIndex+1)+'.'+_sPageExt+'">下一页</a>&nbsp;';      last='<a class="blue" href="'+_sPageName+'_' + (_nPageCount-1)+'.'+_sPageExt+'">尾页</a>&nbsp;'; } else{  if(_nCurrIndex==1){    first='<a class="blue" href="'+_sPageName+'.'+_sPageExt+'">首页</a>&nbsp;'; pre='<a class="blue" href="'+_sPageName+'.'+_sPageExt+'">上一页</a>&nbsp;';    if(_nPageCount==2){ next='<span class="blue">下一页</span>&nbsp;'; last='<span class="blue">尾页</span>&nbsp;'; } else{ next='<a class="blue" href="'+_sPageName+'_' + (nCurrIndex+1)+'.'+_sPageExt+'">下一页</a>&nbsp;'; last='<a class="blue" href="'+_sPageName+'_' + (_nPageCount-1)+'.'+_sPageExt+'">尾页</a>&nbsp;'; }} else{    first='<a class="blue" href="'+_sPageName+'.'+_sPageExt+'">首页</a>&nbsp;'; pre='<a class="blue" href="'+_sPageName+'_'+(nCurrIndex -1)+'.'+_sPageExt+'">上一页</a>&nbsp;'; if(nCurrIndex+1==_nPageCount){ next='<span class="blue">下一页</span>&nbsp;'; last='<span class="blue">尾页</span>&nbsp;'; } else{ next='<a class="blue" href="'+_sPageName+'_' + (nCurrIndex+1)+'.'+_sPageExt+'">下一页</a>&nbsp;'; last='<a class="blue" href="'+_sPageName+'_' + (_nPageCount-1)+'.'+_sPageExt+'">尾页</a>&nbsp;'; } }

}

}

document.write("第"+(nCurrIndex+1)+"页,共"+_nPageCount+"页&nbsp;&nbsp;"+first+pre+next+last); }

createPageHTML(${PAGE_COUNT}, ${PAGE_INDEX}, "${PAGE_NAME}", "${PAGE_EXT}");   </SCRIPT> </div>

HTML静态分页(形如:首页,上一页,下一页,尾页)的更多相关文章

  1. C# 封装首页、上一页、下一月、尾页处理器

    public void BtnPageClickEvent(object sender,string focusForeground,string lostFocusForeground) { But ...

  2. thinkPHP中的文章详情页实现“上一篇下一篇”功能经验分享

    前段时间在公司中接触到了用thinkPHP搭建的项目,其中涉及到了文章详情页上一篇下一篇翻页的功能实现效果. 因为刚接触这套框架和PHP,所以整理一下实现该功能的经验方法. 如果有不到位的地方,欢迎指 ...

  3. 2016/3/27 分页 共X条数据 本页x条 本页从x-y条 x/y页 首页 上一页 123456 下一页 末页 pagego echo $page->fpage(7,6,5,4,3,2,1,0);

    显示效果: fpage.class.php <?php /** file: page.class.php 完美分页类 Page */ class Page { private $total; / ...

  4. GridView自带分页 1总页数 首页 下一页 上一页 尾页 X 页 go 实现方法 .

    在前台GRIDVIEW中添加如下代码 <PagerTemplate> <table> <tr> <td style="text-align: rig ...

  5. thinkPHP生成静态分页列表

    改造分页类Pagehtml.class.php <?php // 静态分页列表类 class Pagehtml extends Think { //分页url public $pageUrl; ...

  6. JQuery Pagination 分页插件 增加了首页尾页以及跳转功能

    JQuery分页插件 挺好用的 但是官方是没有提供首页尾页以及跳转功能 我觉得这个功能可以有,于是就改进了一下 一个js一个css从连接里面下 链接:http://pan.baidu.com/s/1n ...

  7. GridView自定义分页样式(上一页,下一页,到第几页)

    今天要为网站做一个文章列表,发现GridView的分页样式很难看,于是结合网上的例子,自己做了一个.不是很美观,不过还是很实用的,先看下效果吧,如图(1). 图(1)GridView分页效果 自定义G ...

  8. jQuery静态分页功能

    分页功能在做项目的过程中是常常用到的,下面是我常用的一款分页效果: 1.分页的CSS样式(page.css) #setpage { margin: 15px auto; text-align: cen ...

  9. Python - Django - 添加首页尾页上一页下一页

    添加首页和尾页: views.py: from django.shortcuts import render from app01 import models def book_list(reques ...

随机推荐

  1. 移动端 微信 网易 触屏滑动回弹菜单(css版)

    总结一下: 有点:网易新闻,微信 热文 都是 -webkit-overflow-scrolling: touch;实现,css实现,轻巧: bug: 部分安卓浏览器(uc,自带)  只支持持续滑动,不 ...

  2. Androids含文档erver结束(工具包 Httputils)两

    在同server在...的基础上,本文client还登录界面 Andriod简单http get请求基础上,用户注冊后跳转到下载界面,本文下载界面仅仅有两个View,一个是textView显示注冊后u ...

  3. LinkedBlockingQueue的put,add跟offer的区别(转)

    LinkedBlockingQueue的put,add和offer的区别 最近在学习<<Java并发编程实践>>,有很多java.util.concurrent包下的新类.Li ...

  4. iptables惹的祸

    我的工作环境总是一台Mac机+在Mac机上跑的虚拟机(Virtual Box) 有一个错误我总是在犯:宿主机总是无訪问到虚拟机里的web服务. 解决方法也非常easy:那就是关闭虚拟机上的防火墙!!! ...

  5. 使用 Advanced Installer 打包 一键安装Web应用程序

    原文:使用 Advanced Installer 打包 一键安装Web应用程序 安装预览: 资源下载: 示例安装包 操作流程: 1.新建Asp.net Application. 2.设置应用程序名称和 ...

  6. wordpress常见的问题

    nginx如webserver,wordpress上传主题错误 413 Request Entity Too Large 解决: vim /usr/local/nginx/conf/nginx.con ...

  7. 快速入门:十分钟学会Python(转)

    初试牛刀 假设你希望学习Python这门语言,却苦于找不到一个简短而全面的入门教程.那么本教程将花费十分钟的时间带你走入Python的大门.本文的内容介于教程(Toturial)和速查手册(Cheat ...

  8. C++11实现模板手柄:委托构造函数、defaultkeyword分析

    C++11.使用委托构造函数.和高速变量初始化,defaultkeyword重新声明默认构造函数,回答pod状态. 分析与推荐的方法. 到目前为止,VS2012和2013异常声明兼容还是停留在通信代码 ...

  9. Java数据结构与算法(13) - ch06递归(归并排序)

    时间为O(N*logN). 归并排序的一个缺点是它需要在存储器中有另一个大小等于被排序的数据项数目的数组.归并两个有序的数组.利用递归,不断的将数组进行二分法排序,然后进行归并即可.

  10. 小记 js unicode 编码解析

    原文:小记 js unicode 编码解析 var str = "\\u6211\\u662Funicode\\u7F16\\u7801"; 关于这样的数据转换为中文问题,常用的两 ...