2012-01-28 47 views
0

當瀏覽器處於40%滾動時,我正在使用jquery/ajax提取更多內容。當ajax查詢返回無數據時如何更改div

這是查詢腳本;

$(document).ready(function(){ 
    var fetching = false; 

     function lastPostFunc() { 
      fetching = true; 
       $('div#loadmorebutton').html('<a>Loading...pls wait</a>'); 
       $.post("loadmore.php?id=1&lastid="+$(".postitem:last").attr("id"), 

     function(data){ 
      if (data != "") { 
        $(".postitem:last").after(data); 
         setTimeout(function(){ 
         fetching = false; 
         },300); 
         $('div#loadmorebutton').empty(); 
        } 
      }); 
     }; 


$(window).scroll(function(){ 
    var bufferzone = $(window).scrollTop() * 0.40; 
    if (!fetching && ($(window).scrollTop() + bufferzone > ($(document).height()- $(window).height()))){ 
    lastPostFunc(); 
    } 
}); 

});

而加載更多的div是;

<div id="loadmorebutton">Loading...pls wait</div> 

一切都很正常,但是當它到達最後的內容或沒有更多的要加載的內容,我想「正在加載...請等待」更改爲類似「沒有更多的要加載的內容」。目前,它保持「正在加載...請稍候」。我必須做什麼?

注意:以下腳本可以工作,並且可以從「加載更多」更改爲「無需加載更多內容」。不使用此腳本的原因是,只有當您觸及屏幕底部時纔會觸發,這會導致雙倍負載或三倍的時間。嘗試結合代碼,但它仍然無法正常工作。

$(window).scroll(function(){ 
     if($(window).scrollTop() == $(document).height() - $(window).height()){ 
      $('div#loadmorebutton').show(); 
      $.ajax({url: "loadmore.php?id=01&lastid=" + $(".postitem:last").attr("id"), 
     success: function(html){ 
        if(html){ 
         $("#postswrapper").append(html); 
         $('div#loadmorebutton').hide(); 
        }else{ 
         $('div#loadmorebutton').html('<a>No more posts to show.</a>'); 
        } 
       } 
      }); 
     } 
    }); 

回答

0

我想你會從服務器收到一條消息,當沒有更多的內容看到這個Server codes。當你知道你應該能夠基於此設置一條消息。在運行AJAX時查看完整設置。在這裏尋找這個'(jqXHR,textStatus)':AJAX properties應該返回消息,設置一個規則,然後你可以更新DOM。

+0

Thanx Cool。我不是一個程序員,是一個設計師,只是試着寫一些腳本。只希望有人能夠編輯上面的腳本來做我想做的事情。 – 2012-01-28 16:26:30