2013-06-02 81 views
1

我剛剛開始學習PHP,並試圖構建我的第一個數據驅動的網頁以幫助我學習,但現在我似乎遇到了一個令我瘋狂的問題。用分頁計算段落

這裏有一點背景。

我一直在試圖做的是從數據庫中提取內容,這個內容已經用html段落標記標記了。內容將被用戶提交,所以我無法知道每行將包含多少段落。

我然後循環瀏覽內容並計算段落,以便最終在每個包含div的5個段落中結束。

這裏是我使用這樣做的代碼,我知道我的代碼是有點基本的,但它似乎很好,只要所有的內容只是一個單一的查詢檢索工作。

$stmt = $db->prepare('SELECT * FROM content'); 
$stmt->execute(); 

foreach($stmt as $row) { 
$allParagraphs .= $row['content']; 
} 

$paragraphArray = explode("</p>", $allParagraphs); 
$paragraphCount = 0; 
echo '<div class="bookPage">'; 

foreach ($paragraphArray as $value) { 
echo $value; 
$paragraphCount = $paragraphCount + 1; 

if ($paragraphCount == 5){ 
    echo '</div><div class="bookPage">'; 
    $paragraphCount = 0; 
    } 


} 

echo '</div>'; 

現在我的問題。

現在我想包括使用PHP和JQuery的無盡滾動效果分頁。我有足夠的信心去做這件事。然而,我已經注意到,當我使用分頁時,我正在使用的當前代碼(每5個段落計數)不起作用。

據我所知,在完成代碼後,將要發生的事情是將要插入結束div,然後當通過ajax進行第二個查詢時(閱讀更多鏈接單擊),它將進行導致一個新的開放分區。這會導致每個查詢的剩餘段落被div標記包圍,並且不包含我需要的5個段落。

基本上,在其最簡單的方面,我想這樣做是仍然能夠每包5段左右div標籤,但也仍然能夠通過AJAX進行分頁的結果。 如果任何人都可以告訴我最好的方式去與此它將非常感激。

我迄今這個問題的思索......

我不知道如果這使我相信我有這個走近錯誤的方式這甚至有可能做到。我不是很此刻的經歷,但我不禁想到,這將是更容易儲存在數據庫中的單獨一行每一個段落,這將允許我再拉出來在5的倍數但是後來,事情其他人告訴我,這根本不會是一個實際的解決方案,尤其是因爲我無法知道每個用戶會寫/提交多少段落。

我沒有足夠的積分,所以在這裏張貼圖片是圖片上傳我在試圖證明我的意思我應該在描述了這個問題的嘗試是不夠的鏈接。

圖顯示問題

Diagram showing issue

預先感謝您的任何建議。

回答

0

我想你可以刪除PHP腳本中的所有HTML標記,然後僅返回段落的內容,例如JSON對象。

所以,基本上,你會返回類似:

echo json_encode($paragraphArray); 

,並要求與jQuery這樣的(這是在http://api.jquery.com/jQuery.getJSON/收養第一個例子中的):

jQuery.getJSON('yourURL.php', function(data) { 
    var items = []; 

    jQuery.each(data, function(key, val) { 
     items.push('<p>' + val + '</p>'); 

     if(items.length == 5) { 
      appendItemsToBody(items); 
      items = []; 
     } 
    }); 

    appendItemsToBody(items); 
}); 

function appendItemsToBody(items) { 
    if(items.length) { 
     jQuery('<div/>', { 
      'class': bookPage, 
      html: items.join('') 
     }).appendTo('body'); 
    } 
} 

根據在點擊「加載更多」時會發生什麼情況,您可以通過jQuery.getJSON()(請參閱他們的API文檔)將當前顯示的項目的數量作爲數據傳遞給PHP腳本的調用,然後在您的PHP腳本你應該返回哪段(即從哪裏開始)。您必須附加段落的「休息」以填充jQuery中現有的最後一個div的5個項目,並將剩餘的部分放入新的div中。