溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

頁碼部分的js

發(fā)布時間:2020-06-26 18:35:52 來源:網(wǎng)絡 閱讀:500 作者:魔法貓 欄目:web開發(fā)

<!--頁碼部分開始-->
     <div class="public_ym" >
        <ul id="upage">
          <li id="public_ym_left"><a href="javascript:void(0)" ></a></li>
          <?php
          for($j=1;$j<=$totalpage;$j++){

           echo '<li><a id="page'.$j.'" class="vpage" href="javascript:void(0)">'.$j.'</a></li>';
           }

           if($totalpage>5)
           echo '<li><a href="javascript:void(0)" >......</a></li>';
           ?>
          <li id="public_ym_right"><a href="javascript:void(0)"></a></li>
        </ul>
        <table border="0" cellpadding="0" cellspacing="0" class="public_tzy">
           <tr>

             <td width="59"> 共<span id="sump"><{$totalpage}></span>頁<span>
             <td width="64" align="right">到第</td>
             <td width="57" align="center"><input name="" type="text" class="ym_tzys" /></td>
             <td><input type="button" id="jump" name="" value="跳"/></span></td>
           </tr>
        </table>
   </div>
<!--頁碼部分結(jié)束-->
<!--頁碼部分js-->
<script>
   $(function(){
   //取總頁數(shù)
       var sump=$('#sump').text();
       //頁面左側(cè)按鈕
           $('#public_ym_left').live('click',function(){
               //<符號的右側(cè)的第一個號

           var sibQ=$('#public_ym_left').next().text();
           //定起始位置,滑動頁碼
           if(sibQ>=1&&sibQ<=5) var start=1;
           if(sibQ>5)
               var start=parseInt(sibQ)-4;
               start=start<0?0:start;
           $("#upage").children().remove();
           var childQ=$('<li id="public_ym_left"><a href="javascript:void(0)"></a></li>');
           var childH=$('<li id="public_ym_right"><a href="javascript:void(0)"></a></li>');
           if(parseInt(end)>5)
               var loage=$('<li><a href="javascript:void(0)">......</a></li>');
           else
               var loage=$('<li><a href="javascript:void(0)" >......</a></li>');    
           //鏈接左滑動按鈕
           $("#upage").append(childQ);
           var end=(start+5>parseInt(sump))?parseInt(sump):(start+5);
           for(var i=start;i<=end;i++)
           {
               var son=$('<li><a class="vpage" id="page'+i+'" href="javascript:void(0)">'+i+'</a></li>');
               $("#upage").append(son);
           }
           //鏈接省略號
               $("#upage").append(loage);
           //鏈接右滑動按鈕
               $("#upage").append(childH);
               $('#public_ym_left').unbind();
       });    
       //頁碼右側(cè)按鈕
       $('#public_ym_right').live('click',function(){

           var sibH=$('#public_ym_right').prev().prev().text();

           //定起始位置,滑動頁碼
           var start=parseInt(sibH);
           $("#upage").children().remove();
           var childQ=$('<li id="public_ym_left"><a href="javascript:void(0)"></a></li>');
           var childH=$('<li id="public_ym_right"><a href="javascript:void(0)"></a></li>');
           if(parseInt(end)>5)
               var loage=$('<li><a href="javascript:void(0)">......</a></li>');
           else
               var loage=$('<li><a href="javascript:void(0)" >......</a></li>');    
           $("#upage").append(childQ);
           var end=(start+5>parseInt(sump))?parseInt(sump):(start+5);
           for(var i=start;i<=end;i++)
           {
               var son=$('<li><a class="vpage" id="page'+i+'" href="javascript:void(0)">'+i+'</a></li>');
               $("#upage").append(son);
           }  
               $("#upage").append(loage);
               $("#upage").append(childH);
               $('#public_ym_right').unbind();    

       });
       //頁面跳轉(zhuǎn)輸入框控制
       $('.ym_tzys').bind('blur',function(){
           var p=$('.ym_tzys').val();
           if(p>sump) $('.ym_tzys').val(sump);
       });


       //點擊具體頁碼或是頁面跳轉(zhuǎn)按鈕,跳轉(zhuǎn)頁面
       $('.vpage').live('click',function(){
           var p=$('.ym_tzys').val();

           var pgNum=(!p||p<sump)?($(this).text()):p;
           //alert(pgNum);
           $.post('__URL__/turnpage',{page:pgNum},function(data){
               //alert(data['gd'][1]['goodsURL']);
               if($('#bfcontent').children().length==5)
                   $('.title_more').css('display','block');
               $.each($('.vpage'),function(i,val){
                   $('.vpage').css('background-p_w_picpath','url(__PUBLIC__/Home/img/ym_link.png)');

               });
           $(this).css('background-p_w_picpath','url(__PUBLIC__/Home/img/ym_hover.png)');//所點擊的頁為粉色背景
           $(this).css('color','#fff');//所點擊的頁為粉色背景

               //$("#button1").after("<span>內(nèi)容</span>")   $("<span>內(nèi)容</span>").insertAfter("#button1")
           start=parseInt(pgNum);

           $("#upage").children().remove();
           var childQ=$('<li id="public_ym_left"><a href="javascript:void(0)"></a></li>');
           var childH=$('<li id="public_ym_right"><a href="javascript:void(0)"></a></li>');
           if(parseInt(end)>5)
               var loage=$('<li><a href="javascript:void(0)">......</a></li>');
           else
               var loage=$('<li><a href="javascript:void(0)" >......</a></li>');        
           $("#upage").append(childQ);
           var end=(start+5>parseInt(sump))?parseInt(sump):(start+5);
           for(var i=start;i<=end;i++)
           {
               var son=$('<li><a class="vpage" id="page'+i+'" href="javascript:void(0)">'+i+'</a></li>');
               $("#upage").append(son);
           }
               $("#upage").append(loage);
               $("#upage").append(childH);
               $('#page'+start).css('background-p_w_picpath','url(__PUBLIC__/Home/img/ym_hover.png)');
               $('#page'+start).css('color','#fff');


               //    清空頁面內(nèi)容,重新鏈接新頁面的數(shù)據(jù)節(jié)點
               $('#cttwhl').children().remove();


           for(var j=0;j<2;j++)
               {//alert(data['curpage']);
                   var k=(data['curpage']-1)*2+j;

                   var bfcont=$('<div class="zy_scj_box" id="wc'+k+'"></div>');
                   $('#cttwhl').append(bfcont);
                   for(var i=0;i<6;i++){
                   var m=k*6+i;

                   var son1=$('<div class="zy_scj_box_wai" id="divbx'+m+'"></div>');
                   $('#wc'+k).append(son1);

                   var hson=$('<h2><a href="__APP__/Goods/dpxq/goodsID/'+data['gd'][m]['goodsID']+'" target="_parent"><img src="'+data['gd'][m]['goodsURL']+'" /></a></h2>');
                   $('#divbx'+m).append(hson);
                   var sons=$('<div class=""><table width="150" border="0" cellspacing="0" cellpadding="0"><tr><td><table width="150" border="0" cellspacing="0" cellpadding="0"><tr><td width="20"><input name="suoyou" type="checkbox" value="" /></td><td width="130"> '+data['gd'][m]['goodsName']+'</td></tr></table></td></tr><tr><td class="zy_cont_size">¥:'+data['gd'][m]['goodsPrice']+'</td></tr><tr><td><table width="150" height="26" border="0" cellspacing="0" cellpadding="0"><tr><td width="24" class="zy_tb_jrdp"><a href="#">&nbsp;</a></td><td width="24" class="zy_wdfx_02" un="kkkk'+data['gd'][m]['goodsID']+'"><a href="#">&nbsp;</a></td><td width="32">&nbsp;</td></tr></table></td></tr></table></div>');
                   $('#divbx'+m).append(sons);
               }

               }
           },'json');
       });

   });
</script>

/*--頁碼數(shù)--*/
.public_ym{ margin:0 auto; width:570px; height:50px; padding-top:50px; clear:both;}
.public_ym ul{ float:left;}
.public_ym ul li{ display:block; text-align:center; f; height:39px; line-height:32px; background:url(../img/ym_link.png); font-size:14px; font-family:"微軟雅黑";}loat:left; padding-left:10px;}
.public_ym ul li a{ display:block;width:38px
.public_ym ul li a:hover{ display:block; background:url(../img/ym_hover.png) no-repeat; color:#FFF;}
#public_ym_left a{ background:url(../img/ym_link_left.png);width:38px; height:39px; display:block;}
#public_ym_left a:hover{ background:url(../img/ym_hover_left.png);width:38px; height:39px; display:block;}
#public_ym_right a{ background:url(../img/ym_link_right.png);width:38px; height:39px; display:block;}
#public_ym_right a:hover{ background:url(../img/ym_hover_right.png);width:38px; height:39px; display:block;}
.public_tzy{ float:left; width:180px; line-height:30px;}
.ym_tzys{ width:40px; border:1px solid #c2c2c2; height:20px; text-align:center;}
/*--頁碼數(shù)--*/

向AI問一下細節(jié)

免責聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI