Question

我在网上搜索很多次，但我没有找到解决问题的简单方法。我有一个包含大量记录的mysql表。我有这个jQuery代码：

$(document).ready(function(){
    var screenHeight = $(window).height();
    $(window).scroll(function(){
        var scroll = $(this).scrollTop();
        var divHeight = $('#data').height();
        var totalHeight = screenHeight + scroll; 
        var left = divHeight - totalHeight;
        if(left < 10)
            $('#loader').html('<img src="images/loading.gif"> Loading');
            //There must be a function
    });
});

如何使最初显示在页面10上的记录以及向下滚动显示10条记录？

我的英语非常糟糕，抱歉翻译。

Answer 1

你想要做的是在你的JavaScript中有一个计数器变量，它将保存页面上当前显示的项目数。对于您的示例，此计数器将等于10（页面上的10个初始项目）。

当您向服务器发送AJAX请求时，您将包含此计数器变量 - 它将在SQL查询中用于跳过您正在显示的项目：

$query = "SELECT * FROM items LIMIT 5, $counter ORDER BY create_time"

这将返回5个项目但跳过第一个$counter行（前10行）。

当JavaScript收到回复时，您将计算您获得的项目数量并将该数字添加到您的计数器中。你的柜台现在应该是10 + 5 .. 15 ......

下次您从服务器请求更多内容时，它将跳过15个项目，并且只提供接下来的5个项目。

Answer 2

Scroll就像没有点击的标准分页。因此，您的查询必须采用参数，以便您可以识别所需的记录部分（从x到y）然后你只需要在容器的末尾添加一组新的行。我建议你首先让它在没有数据库访问的情况下工作，将原始静态html附加10次以查看原始代码的行为。

如何用mysql实现无限滚动？

2 个答案: