2016-02-21 131 views
0

IM試圖使來自Web服務加載內容腳本時用戶滾動到該頁面的底部是我的JS代碼:加載內容不工作

var serviceURL = "http://projects.dev/work/"; 
 
var current_page = 1; 
 
var total_pages = 1; 
 
$(function() { 
 
    Init(); 
 
}); 
 

 
function Init() { 
 
\t getPosts(); 
 
\t $(window).scroll(function(){ 
 
\t \t if((($(window).scrollTop()+$(window).height())+20)>=$(document).height()){ 
 
\t \t \t if(current_page <= total_pages){ 
 
\t \t \t \t getPosts(); 
 
\t \t \t } 
 
\t \t } 
 
\t }); 
 
} 
 
function getPosts(){ 
 
\t $.ajax({ 
 
\t \t url:serviceURL+"api/posts?page="+current_page, 
 
\t \t dataType: "json", 
 
\t \t async : false, 
 
\t \t cache : false, 
 
\t }).then(function(data){ 
 
\t \t total_pages = data.last_page; 
 
\t \t \t $.each(data.data, function(index, post) { 
 
\t \t \t \t $('#newsList').append("<li>"+ 
 
\t \t \t \t "<aside><img src='"+serviceURL+"cdn/"+post.picture+"'></aside>"+ 
 
\t \t \t \t "<div>"+ 
 
\t \t \t \t "<a href='post.html?id="+post.id+"'><h3>"+post.title+"</h3></a>"+ 
 
\t \t \t \t "<h4>"+post.created_at.split(" ")[0]+"</h4>"+ 
 
\t \t \t \t "</div>"+ 
 
\t \t \t "</li>"); 
 
\t \t \t }); 
 
\t \t \t $("#loading").hide("slow"); 
 
\t \t current_page++; 
 
\t }); 
 
}
<!DOCTYPE html> 
 
<html dir="rtl"> 
 
    <head> 
 
     <meta charset="utf-8" /> 
 
     <meta name="format-detection" content="telephone=no" /> 
 
     <meta name="msapplication-tap-highlight" content="no" /> 
 
     <!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 --> 
 
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, target-densitydpi=medium-dpi, user-scalable=0" /> 
 
     <link rel="stylesheet" href="css/main.css"> 
 
    </head> 
 
    <body> 
 
    <div id="loading"><div id="loading-spin"></div></div> 
 
    <header><div id="brand">News</div> 
 
    <a href="index.html" class="medIcons left" id="back"></a> 
 
    </header> 
 
    <article style="width:100%;margin:0 !important;padding-right:0 !important;padding-left:0 !important;"> 
 
    <ul id="newsList"></ul> 
 
    
 
    </article> 
 
    
 

 

 

 

 
    
 
     
 
     <script type="text/javascript" src="js/jquery.min.js"></script> 
 
     <script type="text/javascript" src="js/posts.js"></script> 
 
    </body> 
 
</html>
你能告訴我什麼是錯的嗎?我可以從第一次只獲得帖子,然後當我滾動到頁面底部時什麼也沒有發生。 PS:我有很多帖子,而last_page變量是我在我的數據庫中的頁面總數。

+0

你有沒有嘗試過調試一下?你的getPosts()函數被調用了嗎? –

+0

@RusPaul不,它沒有被調用 – Hamzar

回答

0

我修好了,我不得不刪除溢出:從容器隱藏。 謝謝。

相關問題