$.getJSON() 请求（加载更多，到达一定限度提醒没有更多）

构建数据通讯的桥梁：getJSON()

getJSON(url,[data],[callback])
url (String) 发送请求地址
data (Map) (可选) 待发送 Key/value 参数
callback (Function) (可选) 载入成功时回调函数。

JSON是一种理想的数据传输格式，它能够很好的融合与JavaScript或其他宿主语 言，并且可以被JS直接使用。使用JSON相比传统的通过 GET、POST直接发送”裸体”数据，在结构上更为合理，也更为安全。至于jQuery的getJSON()函数，只是设置了JSON参数的 ajax()函数的一个简化版本。这个函数也是可以跨域使用的，相比get()、post()有一定优势。另外这个函数可以通过把请求url写 成”myurl?callback=X”这种格式，让程序执行回调函数X。

$.getJSON('feed.jsp',{
   request: images,
   id:      001,
   size:    large
   }, function(json) {
    alert(json.images[0].link);
    //此处json就是远程传回的json对象，假设其格式如下：
    //{'images' : [
    // {link: images/001.jpg, x :100, y : 100},
    // {link: images/002.jpg, x : 200, y 200:}
    //]};
   }
 );

其中$.getJSON(url,{},function(){})与$.get(url,{},function(){},'json')与$.get(url,{},function(){var data=JSON.parse(data);})等价！

其中HTML代码为：

<ul id="forum-discuz" class="ylist ylist-padding">
        <!--{loop $threadlist $vo}-->
        <a href="$vo[url]">
            <li class="row" href="$vo[url]">
                <div class="author-thumb">
                    <img src="$vo[avatar]" alt="$vo[author]"/>
                </div>
                <div class="row-item">
                    <div class="m">$vo[author]</div>
                    <div class="s">$vo[dateline]</div>
                </div>
                <div class="row-badge-wrap">
                    <!-- <div class="ybadge ybadge-4">置顶</div> -->
                    <span class="social"><i class="iconfont icon-replay"></i>$vo[replies]</span>
                </div>
            </li>
            <div class="title">$vo[title]</div>
            <div class="images" href="$vo[url]">
                <!--{loop $vo[attachment] $key $attach}-->
                <img src="$attach" alt="$vo[title]_$key"/>
                <!--{/loop}-->
            </div>
        </a>
        <!--{/loop}-->
    </ul>
    <div style="padding: 0 8px;">
        <a id="load-more-forum-discuz" href="javascript:;" class="ybtn loadmore">加载更多</a>
    </div>
</div>

JS代码为：

//json加载
  if($('#load-more-forum-discuz').length > 0){
  var page=2;
   $('#load-more-forum-discuz').on("click",function(){
    
    $.getJSON(location.href,{page:page,mobile:2},function(item){
        if(item.nextpage==1){
          $('#load-more-forum-discuz').html('没有更多了');
        }
        var data=item.threadlist;
        for(var i in data)
        {
            var goodslist='<a href="'+data[i].url+'">';
            goodslist+='<li class="row" href="'+data[i].url+'">';
            goodslist+='<div class="author-thumb"><img src="'+data[i].avatar+'" alt="'+data[i].author+'"></div>'
            goodslist+='<div class="row-item"><div class="m">'+data[i].author+'</div><div class="s">'+data[i].dateline+'</div></div>';
            goodslist+='<div class="row-badge-wrap"><span class="social"><i class="iconfont icon-replay"></i>'+data[i].replies+'</span></div>';
            goodslist+='</li>';
            goodslist+='<div class="title">'+data[i].title+'</div>';
            goodslist+='<div class="images" href="'+data[i].url+'">';
            var arr=data[i].attachment;
            for(var im in arr){
              goodslist+='<img src="'+arr[im]+'">';
            }
            
            goodslist +='</div></a>';
           $('#forum-discuz').append(goodslist);

        }
        page++;
        
      });
    return false;  
  });
} 

效果图为：

文件路径为：

http://www.5usport.com/forum.php?page=2

http://www.5usport.com/forum.php?page=3

http://www.5usport.com/forum.php?page=4

http://www.5usport.com/forum.php?page=5

...