滚动加载更多 SQL 限制答案

【问题标题】：Scroll Load More SQL Limit滚动加载更多 SQL 限制
【发布时间】：2015-09-19 20:49:25
【问题描述】：

所以我已经布局并制作了这个网站，但现在我需要在滚动上加载更多结果。这已经被问了一百万次了，但我想知道是否有一种简单的方法可以适应我的构建。理想情况下，我想做一些有限制的事情，但我所看到的一切都是关于拥有一个完全独立的页面。

页面示例-

$sql = "SELECT * FROM `Products` ORDER BY id LIMIT 0,4 ";

echo    "<div class=\"full_container\">";
echo        "<div class=\"full\">";

if ($result = mysqli_query($con, $sql)) {

while ($row = mysqli_fetch_assoc($result)) {

echo            "<div class=\"item_frame\">";
echo                "<div class=\"item\">";
echo                    "<h5>".$row["Name"]."</h5>";
echo                "</div>"; #Item End#
echo            "</div>"; #Item_Frame End#

JS 例子-

$(window).scroll(function() {
if($(window).scrollTop() + $(window).height() > $(document).height() - 100) {

///Where I would have the limit fix

}
});

这是否可以轻松切换以在滚动时加载更多内容，还是我必须使用第二个 php 页面才能使用 ajax？

【问题讨论】：

标签： javascript php jquery sql ajax

【解决方案1】：

要获取更多信息，您可能必须通过 ajax 进行调用，然后在返回数据后使用 javascript 渲染新图像。您可以像处理常规分页一样处理它，只需记住您有多少个结果并将其输入到您的限制中，例如

(function () {
  var page = 2,
      uri = 'moreImages.php';

  $(window).scroll(function() {
    if($(window).scrollTop() + $(window).height() > $(document).height() - 100) {

      $.get (uri, {page: page}, function (data) {
        page ++;
        $('#container').append (data);
      });

    }
  });
}) ();

然后在您的 PHP 页面中，您只需要根据分页规则计算出偏移量

$page = (int) @$_GET['page'] ?: 1;

$numItems = 4;
$start = ($page - 1) * $numItems;

$sql = "SELECT * FROM `Products` ORDER BY id LIMIT {$start}, {$numItems}";

差点忘了： 在他们到达页面底部之前发送请求可能也是值得的以加快速度。确保在您的代码中设置一个标志，以标记您正在等待信息，并且仅在信息明确时才请求更多信息，否则您将在滚动时不断发送请求。

【讨论】：