• js分页


    • js文章分页,自己写的

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="keywords" content="{$siteInfo.keywords}" />
    <meta name="description" content="{$siteInfo.description}" />
    <title>{$siteInfo.sitename}--{$guideTitle}</title>
    <link href="__STYLE__/CN.css" rel="stylesheet" type="text/css" />
    <style>
    #js_page
    {height:18px; line-height:18px; padding-top:5px; text-align:center;}
    #js_page a
    {padding:2px 4px 1px; border:#50A0C0 solid 1px; margin-right:6px; line-height:12px; text-decoration:none;}
    </style>
    </head>
    <body>
    <div class="ArticleContent" id="page_con">正在读取文章,请稍后...</div>
    <div id="js_page" style="display:none;"></div>
    <textarea id="c" style="display:none;"><if condition="$Info.content eq ''">抱歉,暂无内容!</if>{$Info.content}</textarea>
    </body>
    </html>
    <script type="text/javascript">
    //初始化分页类
    var CONTENTpager = function(CId,SId,PId,Fn,CMark){
    this.CMark = CMark || '{>Page<}';
    this.Con = new Array();
    this.ConObj = document.getElementById(SId);
    this.PageObj = document.getElementById(PId);
    if(document.getElementById(CId).value.indexOf(this.CMark) == -1){
    this.ConObj.innerHTML = document.getElementById(CId).value;
    return;
    }
    else{
    this.Con = document.getElementById(CId).value.split(this.CMark);
    }
    this.PNum = this.Con.length;
    this.Fn = Fn || 'Go';
    this.Pcur = 1;
    this.PSNum = 3;
    this.show();
    }
    //处理分页按钮
    CONTENTpager.prototype.page = function(){
    var p,P_inner='';
    P_inner
    += '<a href="javascript:;" onclick="'+this.Fn+'(1);">第一页</a>';
    for(var i = 0;i< this.PNum;i++){
    p
    = 1 + i;
    P_inner
    += '<a href="javascript:;"';
    if(p == this.Pcur){
    P_inner
    += ' style="background-color:#50A0C0; color:#003652;"';
    }
    P_inner
    += ' onclick="'+this.Fn+'('+p+');">'+p+'</a>';
    }
    P_inner
    += '<a href="javascript:;">共'+this.PNum+'页</a>';
    this.PageObj.innerHTML = P_inner;
    this.PageObj.style.display = '';
    }
    //显示当前页文章
    CONTENTpager.prototype.show = function(){
    this.ConObj.innerHTML = this.Con[this.Pcur-1];
    this.page();//更新分页按钮
    }

    var c = new CONTENTpager('c','page_con','js_page','Go','<p>{>Page<}</p>');//源文章id,显示文章id,分页id,跳转函数名(这块不怎么会做),分页标志(选填)
    var Go = function(P){
    c.Pcur
    = P;
    c.show();
    //alert(P);
    }
    </script>

    • js列表分页,网上找的

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    <style type="text/css">
    <!--
    /*这里填写自己需要的css定义*/
    body
    { width: 760px; padding: 0 0 0 0; margin: 0 auto 0 auto; font-size: 12px; font-family: "Arial", "Helvetica", "sans-serif"; }
    td
    { font-size: 12px; }
    ul,li,form,div,span
    { padding: 0 0 0 0; margin: 0 0 0 0; }
    .ctrlPages
    {COLOR: #f60;}
    .curPage
    {COLOR: #f00;}
    -->
    </style>
    <script language="JavaScript">
    <!--
    var ETNGpager = function( srcName, dstName, cntPP, cntPS )
    {
    this.srcName = srcName;
    this.dstName = dstName;
    this.curP = 1;//默认当前页为第一页
    this.cntPP = cntPP || 2;//默认每页两条纪录
    this.cntPS = cntPS || 3;//默认每页显示5个分页上下文
    this.items = [];
    this.showPNP = true;/*显示上下页链接*/
    this.showType = true;/*滑动分页*/
    this.result = {pagedata:[],pagebar:'',limit:[0,0],report:''};
    this.parse();/*总纪录数*/
    }
    ETNGpager.prototype.page
    = function (){
    this.cntP = Math.ceil(this.cntR/this.cntPP);/*总页数*/
    this.cntS = Math.ceil(this.cntP/this.cntPS);/*总段数*/
    this.curS = Math.ceil(this.curP/this.cntPS);/*当前段*/
    this.preP = this.curP -1;/*上一页*/
    this.nextP = this.curP +1;/*下一页*/
    this.preS = this.curS -1;/*上一段*/
    this.nextS = this.curS +1;/*下一段*/
    this.startR = (this.curP -1)*this.cntPP + 1;/*起始纪录*/
    this.endR = (this.curP*this.cntPP >this.cntR)?this.cntR:this.curP*this.cntPP;/*结束纪录*/
    this.result['pagedata']=[];
    if(this.showType){
    this.perSide = Math.floor(this.cntPS/2);
    this.startP = (this.curP > this.perSide)?(this.curP - this.perSide):1;
    this.endP = (this.startP + this.cntPS)>this.cntP?this.cntP:(this.startP + this.cntPS);
    }
    else{
    this.startP = (this.curS-1)*this.cntPS+1;
    this.endP = (this.curS*this.cntPS>this.cntP)?this.cntP:(this.curS*this.cntPS);
    }
    for(var i = this.startP;i<=this.endP;i++){
    this.result['pagedata'].push((i==this.curP)?'<span class="curPage">'+i+'</span>':'<span onclick="page('+i+')">'+i+'</span>');
    }
    if(this.showPNP){
    if(this.curP>1)this.result['pagedata'].unshift('<span onclick="page('+(this.curP-1)+')">上一页</span>');
    if(this.curP<this.cntP)this.result['pagedata'].push('<span onclick="page('+(this.curP+1)+')">下一页</span>');
    }
    this.result['pagebar'] = this.result['pagedata'].join('&nbsp;&nbsp;');
    this.result['limit'] = [this.startR,this.endR];
    this.result['report'] = ''+this.cntR+'条,当前页'+this.startR+'- '+this.endR+','+this.curP+'/'+this.cntP+'';
    }
    ETNGpager.prototype.parse
    = function (){
    var obj = document.getElementById(this.srcName);
    for(var i = 0;i<obj.childNodes.length;i++){
    if(obj.childNodes[i].nodeType!=3)this.items[this.items.length]=obj.childNodes[i].innerHTML;
    }
    this.cntR = this.items.length;
    return this.items.length;
    }
    ETNGpager.prototype.create
    =function(){
    this.page();
    document.getElementById(
    this.dstName).innerHTML='<li>'+this.items.slice(this.startR-1,this.endR).join('</li><li>')+'</li>';
    document.getElementById(
    this.dstName).innerHTML+='<span class="ctrlPages">'+this.result['pagebar']+this.result['report']+'</span>';
    }
    //-->
    </script>
    </head>
    <body>
    <ul id="listcontent" style="display:none;">
    <li><a href=http://tech.sina.com.cn/i/2005-12-08/1204786367.shtml target='_blank'>支付宝与六大代理签订协议 </a></li>
    <li><a href=http://forum.taobao.com/showThread.htm?thread=3123988&forum=14 target='_blank'>刷卡积分可网上购物 </a></li>
    <li><a href=/alipay/news/sample/23492.htm target='_blank'>支付宝为网店保驾护航 </a></li>
    <li><a href=http://it.people.com.cn/GB/8219/50656/52310/3822563.html target='_blank'>支付宝红包送来红地毯 </a></li>
    <li><a href=/alipay/news/sample/22701.htm target='_blank'>紧急天气预报"红色风暴"空降支付宝 </a></li>
    <li><a href=/alipay/news/sample/22699.htm target='_blank'>小红包背后大名堂 </a></li>
    <li><a href=http://www.q88.net/SHOP_2005A/zfb.aspx target='_blank'>Q88.net全面无缝接合支付宝 </a></li>
    <li><a href=/alipay/news/sample/21529.htm target='_blank'>电子支付规范走出第一步 使用专业版受鼓励 </a></li>
    <li><a href=/alipay/news/sample/19786.htm target='_blank'>从支付宝看电子商务的发展 </a></li>
    <li><a href=/alipay/news/sample/19784.htm target='_blank'>谁能与支付宝PK? </a></li>
    <li><a href=/alipay/news/sample/19618.htm target='_blank'>国内第一家引入支付宝的网络图库正式开通 </a></li>
    <li><a href=/alipay/news/sample/19475.htm target='_blank'>新浪网:中关村在线加入支付宝联盟 </a></li>
    <li><a href=/alipay/news/sample/19471.htm target='_blank'>千家网店加入支付宝联盟 </a></li>
    <li><a href=/alipay/news/sample/18549.htm target='_blank'>我与支付宝的分分秒秒 </a></li>
    <li><a href=/alipay/news/sample/18207.htm target='_blank'>支付宝—放心“网宝”的理由 </a></li>
    <li><a href=/alipay/news/sample/17944.htm target='_blank'>欧飞数卡携手支付宝,再创新高 </a></li>
    <li><a href=/alipay/news/sample/17803.htm target='_blank'>莎莎香水网:支付宝助我完成销售计划 </a></li>
    <li><a href=/alipay/news/sample/17801.htm target='_blank'>使用支付宝:一个月交易额翻5倍 </a></li>
    <li><a href=/alipay/news/sample/17799.htm target='_blank'>支付宝:一个普通站长的自述 </a></li>
    <li><a href=/alipay/news/sample/17797.htm target='_blank'>新开网店如何日交易额达8000元? </a></li>
    <li><a href=/alipay/news/sample/17563.htm target='_blank'>名大数码:网店月交易额如何突破30万 </a></li>
    <li><a href=http://it.sohu.com/20050916/n240400443.shtml target='_blank'>中国卡网结盟支付宝创交易量周增长新高 </a></li>
    <li><a href=http://it.people.com.cn/GB/42891/42894/3676101.html target='_blank'>支付宝联盟与合作伙伴合作在人民网推广 </a></li>
    <li><a href=http://forum.taobao.com/show_thread-50---103546-.htm target='_blank'>网络银行使用全攻略---足不出户查看汇款明细 </a></li>
    <li><a href=http://forum.taobao.com/show_thread-50---1561087-.htm target='_blank'>"支付宝购物体验"征文-----贿赂 </a></li>
    <li><a href=http://forum.taobao.com/show_thread-50---2102458-.htm target='_blank'>卖家谈:谁是支付宝最终的获利者? </a></li>
    <li><a href=http://forum.taobao.com/show_thread-50---1617047-.htm target='_blank'>淘宝两钻卖家感悟支付宝 </a></li>
    <li><a href=http://forum.taobao.com/show_thread-50---1686484-.htm target='_blank'>支付宝“即时到帐交易”的使用经验及建议 </a></li>
    <li><a href=http://forum.taobao.com/show_thread-50---1794216-.htm target='_blank'>我的第一笔网上交易 </a></li>
    </ul>
    <ul id="listcontent2">列表信息加载中,请您稍等……</ul>
    <script language="JavaScript">
    <!--
    var pager = new ETNGpager('listcontent','listcontent2',10,5);
    var curP = 1;
    showtime
    = setInterval("page()", 5000);
    function page(i){
    curP
    =(curP>pager.cntP)?1:curP;
    if(i){
    curP
    = n =i;
    }
    else{
    n
    = curP++;
    }
    pager.curP
    = (n>pager.cntP)?pager.cntP:n;
    pager.create();
    }
    //-->
    </script>
    </body>
    </html>

  • 相关阅读:
    第二个Sprint
    第一个Sprint
    “尸体解剖” 报告
    软工水平自我评价表
    小学四则运算APP 第一个冲刺阶段 第五天
    小学四则运算APP 第一个冲刺阶段 第四天
    小学四则运算APP 第一个冲刺阶段 第三天
    小学四则运算APP 第一阶段冲刺 第二天-补
    小学四则运算APP 第一个冲刺 第二天
    小学四则运算APP 第一个冲刺阶段 第一天
  • 原文地址:https://www.cnblogs.com/ShepherdIsland/p/1744609.html
Copyright © 2020-2023  润新知