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。这导致每个查询的剩余段落被 div 标签包围，并且不包含我需要的 5 个段落。

基本上，用最简单的术语来说，我想做的是仍然能够在每 5 个段落周围包装 div 标签，但也仍然能够通过 ajax 对结果进行分页。如果有人能告诉我最好的方法，那将不胜感激。

到目前为止我对这个问题的思考......

我不确定这是否可能做到，这让我相信我以错误的方式处理了这个问题。我目前还不是很有经验，但我不禁认为将每个段落存储在数据库中的单独行中会更容易，这样我就可以将它们以 5 的倍数提取出来。但是，有些东西else 告诉我这根本不是一个实用的解决方案，尤其是因为我无法知道每个用户将要编写/提交多少段。

我没有足够的积分来发布图片，所以这里有一个我上传的图片的链接，试图证明我的意思是如果我试图描述这个问题还不够。

显示问题的图表

显示问题的图表

提前感谢您的任何建议。

4

1 回答 1

0

例如，我想您可以删除脚本中的所有HTML标签，PHP然后将段落的内容作为JSON对象返回。

所以，基本上，你会返回类似的东西：

echo json_encode($paragraphArray);

并像这样请求它（这是对http://api.jquery.com/jQuery.getJSON/jQuery的第一个示例的采用）：

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');
    }
}

根据单击“加载更多”时应该发生的情况，您可以将当前显示的项目的计数作为数据传递给您的PHP脚本调用jQuery.getJSON()（请参阅他们的 API 文档），然后在您的PHP脚本中决定您应该返回哪些段落（即从哪里开始）。您必须附加段落的“其余部分”以将 5 个项目填充到现有的最后一个 div 中jQuery，并将其余部分放入新的 div 中。

于 2013-06-02T22:46:17.750 回答