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 相关文章推荐
jquery Firefox3.5中操作select的问题
Jul 10 Javascript
JavaScript开发规范要求(规范化代码)
Aug 16 Javascript
Javascript中获取出错代码所在文件及行数的代码
Sep 23 Javascript
如何将JS的变量值传递给ASP变量
Dec 10 Javascript
JavaScript编写检测用户所使用的浏览器的代码示例
May 05 Javascript
js添加千分位的实现代码(超简单)
Aug 01 Javascript
JQuery Dialog对话框 不能通过Esc关闭的原因分析及解决办法
Jan 18 Javascript
原生js实现放大镜特效
Mar 08 Javascript
input框中自动展示当前日期yyyy/mm/dd的实现方法
Jul 06 Javascript
JS 中document.write()的用法和清空的原因浅析
Dec 04 Javascript
mpvue项目中使用第三方UI组件库的方法
Sep 30 Javascript
微信小程序非swiper组件实现的自定义伪3D轮播图效果示例
Dec 11 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利用str_replace防注入的方法
2013/11/10 PHP
CodeIgniter分页类pagination使用方法示例
2016/03/28 PHP
php求斐波那契数的两种实现方式【递归与递推】
2019/09/09 PHP
Jquery AJAX 用于计算点击率(统计)
2010/06/30 Javascript
jquery幻灯片插件bxslider样式改进实例
2014/10/15 Javascript
jQuery on()绑定动态元素出现的问题小结
2016/02/19 Javascript
JQuery插件Marquee.js实现无缝滚动效果
2016/04/26 Javascript
jquery设置表单元素为不可用的简单代码
2016/07/04 Javascript
Js查找字符串中出现次数最多的字符及个数实例解析
2016/09/05 Javascript
require.js中的define函数详解
2017/07/10 Javascript
详解Angular2表单-模板驱动的表单(Template-Driven Forms)
2017/08/04 Javascript
日期时间范围选择插件:daterangepicker使用总结(必看篇)
2017/09/14 Javascript
详解node nvm进行node多版本管理
2017/10/21 Javascript
Vue使用高德地图搭建实时公交应用功能(地图 + 附近站点+线路详情 + 输入提示+换乘详情)
2018/05/16 Javascript
vue中使用protobuf的过程记录
2018/10/26 Javascript
JavaScript基础之静态方法和实例方法分析
2018/12/26 Javascript
nodejs检测因特网是否断开的解决方案
2019/04/17 NodeJs
微信小程序 如何获取网络状态
2019/07/26 Javascript
Vue Render函数创建DOM节点代码实例
2020/07/08 Javascript
[03:07]完美世界DOTA2联赛PWL DAY10 决赛集锦
2020/11/11 DOTA
Python 2.x如何设置命令执行的超时时间实例
2017/10/19 Python
Python实现通过解析域名获取ip地址的方法分析
2019/05/17 Python
用Anaconda安装本地python包的方法及路径问题(图文)
2019/07/16 Python
python os.path.isfile()因参数问题判断错误的解决
2019/11/29 Python
python 的numpy库中的mean()函数用法介绍
2020/03/03 Python
django-利用session机制实现唯一登录的例子
2020/03/16 Python
Python使用Excel将数据写入多个sheet
2020/05/16 Python
英国天然有机美容护肤品:Neal’s Yard Remedies
2018/05/05 全球购物
贝佳斯官方网站:Borghese
2020/05/08 全球购物
园林资料员岗位职责
2013/12/30 职场文书
订货会邀请函
2015/01/31 职场文书
导游词范文
2015/02/13 职场文书
迎国庆主题班会
2015/08/17 职场文书
用Python进行栅格数据的分区统计和批量提取
2021/05/27 Python
详细谈谈JavaScript中循环之间的差异
2021/08/23 Javascript
Arthas排查Kubernetes中应用频繁挂掉重启异常
2022/02/28 MySQL