zoukankan      html  css  js  c++  java
  • ajax分页

    html显示

    1  <center>
    2 <div id="fyh">
    3  <ul class="pagination" id="fy_list">
    4                    
    5 </ul>
    6 </div>
    7 <input type="hidden" value="1" id="fy_n" />
    8 </center>

     ajax

      1 $(document).ready(function(e){
      2     JiaZai();  4     
      5     //确定总页数的变量
      6     var zys = 0;
      7     //查询数据
      8        
      9     });
     10 
     11 //加载数据方法
     12     function JiaZai()
     13     {
     14         var n = $("#fy_n").val();
     15         
     16         $.ajax({
     17                 url:"./chuli/htshjchuli.php",
     18                 async:false,
     19                 data:{n:n,tp:1},
     20                 type:"POST",
     21                 dataType:"TEXT",
     22                 success: function(data){
     23                         var s ="";
     24                         var hang = data.split("|");
     25                         var strs = "";
     26                         for(var i=0;i<hang.length;i++)
     27                         {
     28                             var lie = hang[i].split("^");
     29                              31                             strs+="<div class='htcontent htcontent1'>"+lie[0]+"</div><div class='htcontent htcontent2'>"+lie[1]+"</div><div class='htcontent htcontent3'>"+lie[2]+"</div><div class='htcontent htcontent4'>"+lie[3]+"</div><div class='htcontent htcontent5'>"+lie[4]+"</div><div class='htcontent htcontent6 ' style='color:"+color+"'><a class='shenhe"+lie[5]+"'  shbs='"+lie[0]+"'>"+shenhe+"</a></div>";
     32                             
     33                         }
     34                         $("#htrecords_nr").html(strs);
     35                         
     36                         
     37                     }
     38             });
     39         shenheshijian();
     40         //获取分页数(列表)
     41         $.ajax({
     42                 url:"./chuli/htshjchuli.php",
     43                 data:{tp:2},
     44                 type:"POST",
     45                 dataType:"TEXT",
     46                 success: function(data){
     47                         //总页数
     48                         var ys = Math.ceil(data/10); 
     49                         zys = ys;
     50                         var cd = zys*48;
     51                         if(zys<5){
     52                             $("#fyh").css("width",cd+"px");
     53                             
     54                             }else{
     55                             $("#fyh").css("width","235px");
     56                             }
     57                         
     58                         var s = "";
     59                         //var s = "<li><a id='fy_shang'>&laquo;</a></li>";
     60                         var dangqian = parseInt($("#fy_n").val()); //当前页数
     61                         
     62                         if(dangqian==1){
     63                             for(var i=dangqian;i<=dangqian+4;i++){
     64                                     if(i>0 && i<=ys)
     65                                     {
     66                                         if(dangqian==i)
     67                                         {
     68                                         s+="<li class='active fy_zhong' style='background-color:#faa66a; color:#FFF'><a>"+i+"</a></li>";
     69                                         }
     70                                         else
     71                                         {
     72                                             s+="<li class='fy_zhong'><a>"+i+"</a></li>"
     73                                         }
     74                                     }
     75                                 }
     76                             }else if(dangqian==2){
     77                                 for(var i=dangqian-1;i<=dangqian+3;i++){
     78                                         if(i>0 && i<=ys)
     79                                         {
     80                                         if(dangqian==i)
     81                                         {
     82                                         s+="<li class='active fy_zhong'  style='background-color:#faa66a; color:#FFF'><a>"+i+"</a></li>";
     83                                         }
     84                                         else
     85                                         {
     86                                             s+="<li class='fy_zhong'><a>"+i+"</a></li>"
     87                                         }
     88                                     }
     89                                 }
     90                             }else if(dangqian==zys){
     91                                 for(var i=dangqian-4;i<=dangqian;i++){
     92                                         if(i>0 && i<=ys)
     93                                         {
     94                                         if(dangqian==i)
     95                                         {
     96                                         s+="<li class='active fy_zhong' style='background-color:#faa66a; color:#FFF'><a>"+i+"</a></li>";
     97                                         }
     98                                         else
     99                                         {
    100                                             s+="<li class='fy_zhong'><a>"+i+"</a></li>"
    101                                         }
    102                                     }
    103                                 }
    104                                 }else if(dangqian==zys-1){
    105                                     for(var i=dangqian-3;i<=dangqian+1;i++){
    106                                         if(i>0 && i<=ys)
    107                                         {
    108                                         if(dangqian==i)
    109                                         {
    110                                         s+="<li class='active fy_zhong' style='background-color:#faa66a; color:#FFF'><a>"+i+"</a></li>";
    111                                         }
    112                                         else
    113                                         {
    114                                             s+="<li class='fy_zhong'><a>"+i+"</a></li>"
    115                                         }
    116                                     }
    117                                 }
    118                                     
    119                                     }else{
    120                                 for(var i=dangqian-2;i<=dangqian+2;i++){
    121                                     if(i>0 && i<=ys)
    122                                     {
    123                                     if(dangqian==i)
    124                                     {
    125                                     s+="<li class='active fy_zhong' style='background-color:#faa66a; color:#FFF'><a>"+i+"</a></li>";
    126                                     }
    127                                     else
    128                                     {
    129                                         s+="<li class='fy_zhong'><a>"+i+"</a></li>"
    130                                     }
    131                                     }
    132                                 }
    133                             }
    134                         //s += "<li><a id='fy_xia'>&raquo;</a></li>";
    135                         $("#fy_list").html(s);
    136                         
    137                            //给分页列表加事件
    138                         JiaShiJian();
    139                     }
    140                 })
    141     }
    142     //给分页列表加事件的方法
    143     function JiaShiJian()
    144     {
    145 /*        $("#fy_shang").click(function(){
    146             
    147                 var n = $("#fy_n").val(); 
    148                 if(n>1)
    149                 {
    150                     n--;
    151                 }
    152                 else
    153                 {
    154                     n=1;
    155                 }
    156                 $("#fy_n").val(n);
    157                 
    158                 //加载数据
    159                 JiaZai();
    160             })
    161         $("#fy_xia").click(function(){
    162                 var n = $("#fy_n").val(); 
    163                 if(n<zys)
    164                 {
    165                     n++;
    166                 }
    167                 else
    168                 {
    169                     n=zys;
    170                 }
    171                 $("#fy_n").val(n);
    172                 
    173                 //加载数据
    174                 JiaZai();
    175             })*/
    176         $(".fy_zhong").click(function(){
    177                 var n = $(this).text();
    178                 $("#fy_n").val(n);
    179                 //加载数据
    180                 JiaZai();
    181             })
    182             
    183     }

    处理

    1 $n = $_POST["n"];
    2         $tg = ($n-1)*10;
    3         $xxlb = "select * from xinxi order by number desc limit {$tg},10";    
    4         echo $db->STRQuery($xxlb);

     1 $xxys = "select count(*) from goumai"; 2 echo $db->StrQuery($xxys); 

    function zishu(){
        $(".nr_nei_s").each(function(){
            //限制字符个数
            var maxwidth=122;
            if($(this).text().length>maxwidth){
                $(this).text($(this).text().substring(0,maxwidth));
                $(this).html($(this).html()+'');
                }
            });
        
        }
    
    function getYmdTime(time){
            if(time > 0){
                var dateStr = new Date(time);
                return dateStr.getFullYear() + '-' + dateStr.getMonth()+1 +'-' + dateStr.getDate() + ' ' + dateStr.getHours() + ':' + dateStr.getMinutes() + ':' + dateStr.getSeconds();
            }else{
                return '末知时间';
            }
        }
  • 相关阅读:
    沙盒配置好的测试
    云端存储的实现:云存储1
    演职人员名单MobileMenuList
    关于GitHub的朋友的NE Game
    到了冲刺阶段
    云存储的配置3
    刚才花了1$赞助了那位伙计
    我知道这对自己是个积累的过程,很好,我成长的很快
    煎熬过后终于有一刻释怀
    空白不曾停止。。。
  • 原文地址:https://www.cnblogs.com/The-second/p/6108168.html
Copyright © 2011-2022 走看看