自动加载结果，一遍又一遍地获取相同的结果答案

【问题标题】：Autoload results fetching same results over and over自动加载结果，一遍又一遍地获取相同的结果
【发布时间】：2018-01-16 19:52:58
【问题描述】：

我已经实现了以下自动加载代码。它从数据库中获取结果，但它会一遍又一遍地循环相同的结果。

php代码

<?php
require_once("config.php");

$limit = (intval($_GET['limit']) != 0 ) ? $_GET['limit'] : 10;
$offset = (intval($_GET['offset']) != 0 ) ? $_GET['offset'] : 0;

$keywords = $_GET['keywords'];

$sql = "SELECT * FROM blog_posts WHERE postCat LIKE '".$keywords."' ORDER BY postID ASC LIMIT $limit OFFSET $offset";
try {
  $stmt = $DB->prepare($sql);
  $stmt->execute();
  $results = $stmt->fetchAll();
} catch (Exception $ex) {
  echo $ex->getMessage();
}
if (count($results) > 0) {
  foreach ($results as $res) {
    echo '<h3>' . $res['postTitle'] . '</h3>';
  }
}
?>

【问题讨论】：

你已经初始化了一个静态 $keyword。它会改变吗？请在ajax中提醒关键字并检查。
@AAT 是的，它只是为了测试目的而更改，我添加了静态。但问题是结果不停地循环
关键字正在获取与数据库列匹配的记录，但如果有类似“Lorem Ipsum”的记录，它会显示在屏幕上，并且越往下滚动，相同的结果就会一直显示
window.busy = false;评论这一行并尝试。我想你的问题会解决的
做了 //window.busy = false;滚动浏览器时仍然会加载更多记录

标签： php mysql ajax pdo

【解决方案1】：

试试这个

<?php
$keywords = 'events';
?>
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Test</title>    
    <script src="bootstrap/js/jquery-1.11.1.min.js"></script>
  </head>
  <body>

        <div class="col-lg-12" id="results"></div>
        <div id="loader_image"><img src="loader.gif" alt="" width="24" height="24"> Loading...please wait</div>
        <div class="margin10"></div>
        <div id="loader_message"></div>
        </div>

 <script type="text/javascript">
    var keywords = '<?php echo $keywords; ?>';  // Changed
    var busy = false;
    var limit = 15;
    var offset = 0;
    function displayRecords(lim, off) {

    // Changed/New
    var data = {
        'limit': lim,
        'offset': off,
        'keywords': keywords,
    };
        $.ajax({
        type: "GET",
        async: false,
        url: "getrecords.php",
        data: data, // Changed
        cache: false,
        beforeSend: function() {
            $("#loader_message").html("").hide();
            $('#loader_image').show();
        },
        success: function(html,textStatus,jqHXR) {
            $("#results").append(html);
            $('#loader_image').hide();
            if (html == "") {
                $("#loader_message").html('<button class="btn btn-default" type="button">No records found.</button>').show()
            } else {
                $("#loader_message").css('display','none');
                $("#loader_message").html(html);
            }
            window.busy = false;
        },
        });
    }
    $(document).ready(function() {
        // start to load the first set of data
        if (busy == false) {
            busy = true;
            // start to load the first set of data
            displayRecords(limit, offset);
         }
        $(window).scroll(function() {
            // make sure u give the container id of the data to be loaded in.
            if ($(window).scrollTop() + $(window).height() > $("#results").height() && !busy) {


$('#result').on('scroll', function() { if($(this).scrollTop() + $(this).innerHeight() >= $(this)[0].scrollHeight) { busy = true; offset = limit + offset; setTimeout(function() { displayRecords(limit, offset); }, 500); } })
                // you can remove the above code and can use directly this function
                // displayRecords(limit, offset);
            }
        });
    });
</script>

  </body>
</html>

【讨论】：

试过事件在加载时在最大化屏幕中有大约 23 条记录，默认情况下它显示 15 条记录，它不再滚动，无论是最大化还是最小化，就像移动屏幕一样:(
那么你的查询获取结果可能有错误
嗨 @AAT 我发布了我的 getrecords.php，一旦我似乎无法弄清楚其中有什么问题，请检查一下
"SELECT * FROM blog_posts WHERE postCat LIKE '".$keywords."' ORDER BY postID ASC LIMIT ($offset,$limit)";
仍然没有记录，但如果我删除 ORDER BY postID ASC LIMIT ($offset,$limit) 然后它显示但没有滚动

【解决方案2】：

这是一遍又一遍地加载相同的内容，因为在每次 ajax 调用中，您都在发送相同的“数据”，即

var data = {
        'limit': limit,
        'offset': offset,
        'keywords': keywords,
    };

更改函数以使用新的限制和偏移

function displayRecords(lim, off) {
    data = {
        'limit': lim,
        'offset': off,
        'keywords': keywords,
    };
    $.ajax({
    type: "GET",
    async: false,
    url: "getrecords.php",
    data: data, // Changed
    cache: false,
    beforeSend: function() {
        $("#loader_message").html("").hide();
        $('#loader_image').show();
    },
    ...
    ...

【讨论】：

浏览器最小化甚至最大化时仍然没有获取所有记录
我总共有 23 条带有事件的记录，但它只显示 16 条，也没有滚动
但是我发送的代码是否解决了相同数据一次又一次出现的问题？
它在页面加载 16 条记录的那一刻没有做任何事情，即使我让浏览器变小也没有任何滚动
我更新了我的帖子并分享了 php 部分，请看看我做错了什么