Question

我正在用php和mysql做一个简单的博客。到现在为止还挺好。但是当我向下滚动时，我想在一个页面上动态加载帖子。它有效，但不完全。我相当平均使用javascript / jquery，ajax等......

结果正在索引页面上加载，但并非所有结果都显示..我有十行，只有 1,3,4,5,7,8,9 显示在结果中。行号 2,6和10 没有..我无法理解这种奇怪的行为..

我的代码如下：

的index.php

<script src="assets/js/load_data.js" type="text/javascript"></script>
<div id="results">
<?php include_once('result_data.php'); ?>
</div>
<div id="loader"><i class="fa fa-spinner fa-pulse fa-2x fa-fw"></i>
<span class="sr-only">Loading...</span></div>

result_data.php

$perPage = 4;
$sql_query = "SELECT blog_posts.id
        ,blog_posts.post_title
        ,blog_posts.post_content
        ,blog_posts.post_date
        ,blog_posts.post_category
        ,blog_posts.post_author
        ,blog_posts.slug
        ,blog_categories.cat_id
        ,blog_categories.cat_name
        ,blog_categories.cat_slug
    FROM blog_posts
    LEFT JOIN blog_categories ON blog_posts.post_category = blog_categories.cat_id
    ORDER BY blog_posts.id DESC;"
$page = 1;
if(!empty($_GET["page"])) {
$page = $_GET["page"];
}
$start = ($page-1)*$perPage;
if($start < 0) $start = 0;
$query = $sql_query . " LIMIT " . $start . "," . $perPage;

$resultset = $conn->prepare($query);
$resultset->execute();
$records = $resultset->fetch(PDO::FETCH_ASSOC);

if(empty($_GET["total_record"])) {
$_GET["total_record"] = $resultset->rowCount();

}

$output = '';
if(!empty($records)) {
$output .= '<input type="hidden" class="page_number" value="' . $page . '" />';
$output .= '<input type="hidden" class="total_record" value="' . $_GET["total_record"] . '" />';
while ($row = $resultset->fetch(PDO::FETCH_ASSOC)) {
$output .= '
<div class="blog-post">
<div class="blog-post-header"><h2><a href="/'.$row['slug'].'">'.$row['post_title'].'</a></h2></div> 
<div class="blog-post-info"><p class="muted">'.strftime("%A, %e %B %Y, %H:%M", $row['post_date']).'</p>
</div> 
<div class="blog-post-short">'.$row['post_content'].'
</div>
<div class="blog-post-footer">Kategori <a href="?category='.$row['cat_slug'].'">'.$row['cat_name'].'</a> av <a href="?author='.$row['post_author'].'">'.$row['post_author'].'</a></div>
</div>';
}
}
echo $output;

load_data.js

$(document).ready(function(){
$(window).scroll(function(){
if ($(window).scrollTop() == $(document).height() - $(window).height()){
if($(".page_number:last").val() <= $(".total_record").val()) {
var pagenum = parseInt($(".page_number:last").val()) + 1;
loadRecord('result_data.php?page='+pagenum);
}
}
});
});
function loadRecord(url) {
$.ajax({
url: url,
type: "GET",
data: {total_record:$("#total_record").val()},
beforeSend: function(){
$('#loader').show();
},
complete: function(){
$('#loader').hide();
},
success: function(data){
$("#results").append(data);
},
error: function(){}
});
}

提前非常感谢！

更新＃1 如果我将$ perPage从4改为比我在数据库中有记录的值更高的值，例如15，它会显示所有结果！所以我把它缩小到了发生窃听的LIMIT OFFSET部分。

更新＃2 之前的更新声明并不完全正确，如果我更改$ perPage值，会显示更多结果，但不是全部！我也手动运行SQL命令，它们完美无瑕地运行。所以问题不在于SQL语句。

更新＃3 我放弃了...经典的分页，发现这个（https://infiniteajaxscroll.com/）真棒插件，完美无瑕！

ajax动态加载未显示所有结果奇怪的行为

0 个答案: