$.get()请求-加载更多-最末页加载更多去掉

示例为:http://m.bagtree.com/filter/index/cat_id/4.html

一,$.get(url,[data],[callback], [type])

http://www.jb51.net/article/20358.htm

说明:url为请求地址,data为请求数据的列表(是可选的,也可以将要传的参数写在url里面),callback为请求成功后的回调函数,该函数接受两个参数,第一个为服务器返回的数据,第二个参数为服务器的状态,是可选参数。而其中,服务器返回数据的格式其实是字符串形势,并不是我们想要的json数据格式,在此引用只是为了对比说明。

1 $.get("data.php",$("#firstName.val()"),function(data){
2 
3   $("#getResponse").html(data); }//返回的data是字符串类型
4 
5 );

其中HTML代码为:

<div class="tab-pane active" id="tab-1">
     <div class="feed-element">
          <a href="" class="pull-left">
             <img class="img-circle" src="http://liaoqiu.usport.cc/upload/head/data/noavatar_middle.jpg">
          </a>
          <div class="media-body ">
               <small class="pull-right"></small>
               <strong>gldmxp</strong>
               <br>
               <small class="text-muted">2015-10-13 16:59:29</small>
               <div class="well">可以了</div>
          </div>
     </div>
     ...
     <input type="hidden" id="val" value="2/1443062261" value="<?php echo $v['weibo_id']."/".$v[ 'wc_time']?>">
     <input type="hidden" id="old_val" value="2/1443062261" value="<?php echo $v['weibo_id']."/".$v[ 'wc_time']?>">
</div>
<button class="btn btn-default btn-block m-t" id="btn_more" data-ajaxurl="http://liaoqiu.chenhua.cc/share/ajax_comment_list/" style="padding: 10px"><i class="fa fa-arrow-down"></i> 加载更多</button>

JS代码为:

$(function(){
    $("#btn_more").on("click",function(){
        var val=$('#val').val();
        var acturl=$(this).attr('data-ajaxurl');
        var url=acturl+val;
        if(val !==''){
            $.get(url,function(data){
               if(data.state_code !=''){
                   var data=JSON.parse(data);
                   data=data.comment_list;
                   var len=data.length;
                   var html='';
                   $.each(data,function(k){
                      html +='<div class="feed-element">';
                      html +='<a href="" class="pull-left"><img class="img-circle" src="'+data[k].member_logo+'"></a>';
                      html +='<div class="media-body ">';
                      html +='<small class="pull-right"></small>';
                      html +='<strong>'+data[k].nick_name+'</strong><br>';
                      html +='<small class="text-muted">'+data[k].wc_time+'</small>';
                      html +='<div class="well">'+data[k].content+'</div>';
                      html +='</div></div><hr />';
                      if(k==9){
                        val=data[k].weibo_id+"/"+totime(data[k].wc_time);
                        $('#val').val(val);
                      }
                   });
                   if(len<10){
                     $('#btn_more').remove();
                     var old_val=$('#old_val').val();
                     $('#val').val(old_val);
                   }
                   $("#tab-1").append(html);
               }else{
                alert('程序有错');
               }
            })
        }
    })
});
function totime(str){
            var str = str.replace(/-/g,"/");
            var date = new Date(str); 
            var humanDate = new Date(Date.UTC(date.getFullYear(),date.getMonth(),date.getDate(),date.getHours(),date.getMinutes(), date.getSeconds()));
            str = (humanDate.getTime()/1000 - 8*60*60);
            return str;
    }

效果图为:

文件路径为:

http://liaoqiu.chenhua.cc/share/ajax_comment_list/2/1443062261

http://liaoqiu.chenhua.cc/share/ajax_comment_list/2/1441764533

posted @ 2015-10-21 18:40  chenguiya  阅读(199)  评论(0)    收藏  举报