JS实现当前页居中分页效果的方法


Posted in Javascript onJune 18, 2015

本文实例讲述了JS实现当前页居中分页效果的方法。分享给大家供大家参考。具体实现方法如下:

function show_page(cur_pc)
{
  var cp=cur_pc;  //curent page count
  var tp=this.p;  //total page count
  var sp=this.pc;  //show page count
  var bp;      //begin page count
  var ep;      //end page count
  if(sp%2==0) sp=sp+1;   //this process need an odd number
  var dp=Math.floor(sp/2); //each side count to show
  var dif=tp-sp;  //check weather it have enough page to make mid-show
  var f=cp-dp;   //to check weather it has enough page to make mid-show from the begin
  var g=tp-(cp+dp); //to check weather it has enough page to make mid-show from the end
  if(sp && dif>=0)
  {
    if(g>0)
    {
      if(f>0)
      { 
        bp=f; 
        ep=cp+dp; 
      }
      else
      { 
        bp=1; 
        ep=2*dp+1; 
      }
    }
    else
    { 
      bp=tp-2*dp; 
      ep=tp; 
    }  
  }
  else
  { 
    bp=1; 
    ep=tp; 
  }
  var buf=[];
  for(var i=bp;i<=ep;i++)
  {
    if(i==cur_pc)
    {
      buf.push("<a href='javascript:;' class='current'>",i,"</a>");
    }
    else
    {
      buf.push("<a href='javascript:;' class='normal'>",i,"</a>");
    }
  }
  document.write(buf);
}

运行效果如下图所示:

JS实现当前页居中分页效果的方法

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
javascript 精粹笔记
May 09 Javascript
extjs grid设置某列背景颜色和字体颜色的方法
Sep 03 Javascript
基于Jquery的跨域传输数据(JSONP)
Mar 10 Javascript
Yii-自定义删除确认弹框(zyd)jquery实现代码
Mar 04 Javascript
5个JavaScript经典面试题
Oct 13 Javascript
JavaScript去除数组里重复值的方法
Jul 13 Javascript
Jquery实现弹性滑块滑动选择数值插件
Aug 08 Javascript
jQuery实现拖拽页面元素并将其保存到cookie的方法
Jun 12 Javascript
使用JSON格式提交数据到服务端的实例代码
Apr 01 Javascript
js 图片转base64的方式(两种)
Apr 24 Javascript
vue-i18n结合Element-ui的配置方法
May 20 Javascript
微信小程序获取位置展示地图并标注信息的实例代码
Sep 01 Javascript
javascript中Date()函数在各浏览器中的显示效果
Jun 18 #Javascript
javaScript中Math()函数注意事项
Jun 18 #Javascript
理解Javascript的动态语言特性
Jun 17 #Javascript
你所不了解的javascript操作DOM的细节知识点(一)
Jun 17 #Javascript
jQuery实现复选框批量选择与反选的方法
Jun 17 #Javascript
在Python中使用glob模块查找文件路径的方法
Jun 17 #Javascript
举例简介AngularJS的内部语言环境
Jun 17 #Javascript
You might like
PHP生成随机用户名和密码的实现代码
2013/02/27 PHP
深入理解:单一入口、MVC、ORM、CURD、ActiveRecord概念
2013/06/06 PHP
PHP图形操作之Jpgraph学习笔记
2015/12/25 PHP
php数据访问之查询关键字
2016/05/09 PHP
php解决和避免form表单重复提交的几种方法
2016/08/31 PHP
PHP 自动加载类原理与用法实例分析
2020/04/14 PHP
PHP读取文件或采集时解决中文乱码
2021/03/09 PHP
javascript学习笔记(十四) window对象使用介绍
2012/06/20 Javascript
JS去除右边逗号的简单方法
2013/07/03 Javascript
jQuery动态效果显示人物结构关系图的方法
2015/05/07 Javascript
利用jQuery设计一个简单的web音乐播放器的实例分享
2016/03/08 Javascript
Highcharts学习之数据列
2016/08/03 Javascript
JavaScript数据结构之广义表的定义与表示方法详解
2017/04/12 Javascript
详解Angular2 之 结构型指令
2017/06/21 Javascript
vue自定义filters过滤器
2018/04/26 Javascript
Vue表单类的父子组件数据传递示例
2018/05/03 Javascript
Angular6笔记之封装http的示例代码
2018/07/27 Javascript
详解如何在webpack中做预渲染降低首屏空白时间
2018/08/22 Javascript
如何用JS模拟实现数组的map方法
2020/07/30 Javascript
python正则表达式去掉数字中的逗号(python正则匹配逗号)
2013/12/25 Python
讲解Python的Scrapy爬虫框架使用代理进行采集的方法
2016/02/18 Python
Python使用matplotlib绘制正弦和余弦曲线的方法示例
2018/01/06 Python
Python实现的当前时间多加一天、一小时、一分钟操作示例
2018/05/21 Python
一百行python代码将图片转成字符画
2021/02/19 Python
tensorflow 20:搭网络,导出模型,运行模型的实例
2020/05/26 Python
美国受欢迎的眼影品牌:BH Cosmetics
2016/10/25 全球购物
印度尼西亚最完整和最大的在线药房网站:Farmaku.com
2019/11/23 全球购物
意大利和国际最佳时尚品牌:Drestige
2019/12/28 全球购物
英国时尚高尔夫服装购物网站:Trendy Golf
2020/01/10 全球购物
致100米运动员广播稿
2014/02/14 职场文书
小区门卫的岗位职责
2014/09/26 职场文书
法人代表证明书格式
2014/10/01 职场文书
2014购房个人委托书范本
2014/10/12 职场文书
工作能力自我评价2015
2015/03/05 职场文书
2015年检验员工作总结范文
2015/04/30 职场文书
win11无法登录onedrive错误代码0x8004def7怎么办 ?
2022/04/05 数码科技