php - 无限滚动一次加载所有项目？

Question

我正在使用一个名为 autobrowse 的脚本它代表一种无限滚动类型的脚本，它从 JSON 文件中提取数据。当我将脚本设置为重复(循环)项目几次时，它就像在 demo example from the creator of the script 中一样完美地工作。 .这是通过在 max 中输入一个更高的值来完成的，就像他们在示例中将其设置为 100 那样从 flickr json 提要中提取数据。

但我不想重复我的结果，而是希望它们像每 10 或 20 个项目一样加载，并在加载 json(数据库)中的最后一个项目时停止。但是，当我在脚本中设置“max: 1”选项以便仅从 JSON 加载我的项目一次时，它会同时显示所有元素，无论它们有多少。没有任何无限滚动。

所以我想设置页面底部每次滚动时应该显示多少项目。例如 10 个。

这就是我生成 JSON 文件的方式:

<?php
$link = mysql_pconnect("localhost", "user", "pass") or die("Could not connect");
mysql_select_db("dbase") or die("Could not select database");

$arr = array();

$rs = mysql_query("SELECT * FROM bannersright ORDER BY HdOrder");

while($obj = mysql_fetch_object($rs)) {
$arr[] = $obj;
}

echo '{"bannersright":'.json_encode($arr).'}';

?>

这就是我在 View 文件中调用自动浏览脚本的方式:

   $(function () {

        $("#wrapper #sidebar-right").autobrowse(

            {

                url: function (offset)
                {                   
                    return "http://www.mysite.com/json.php";
                },
                template: function (response)
                {
                    var markup='';
                    for (var i=0; i<response.bannersleft.length; i++)
                    {
                        markup+='<a href="'+response.bannersleft[i].URL+'"><img src="'+response.bannersleft[i].Image+'" /></a>'
                    };
                    return markup;
                },
                itemsReturned: function (response) { return response.bannersleft.length; },
                offset: 0,
                max: 1,
                loader: '<div class="loader"></div>',
                useCache: false,
                expiration: 1
            }
        );

});

我相信它与偏移函数有关，但不确定如何实现。他们在他们的网站上还有一个推特演示，与此非常相似，但他们这样调用 json:

url: function (offset)
{
    return "http://twitter.com/status/user_timeline/ParisHilton.json?count=10&page=OFFSET&callback=?".replace(/OFFSET/, 1+Math.round(offset/10));
},

(他们的演示不再有效的原因是因为 twitter 更改了他们的 json feeds api)

从他们调用 Twitter 提要的方式来看，我想 Twitter 可以选择在他们的 API 中设置页面。

所以我想我的最后一个问题是:如何使用 JSON 创建页面？我需要将什么 php 代码添加到我的 json.php 文件中，以便能够在页面中从中获取元素？

不一定非要json页面，如果你有其他解决方案请分享。

Answer 1

您忘记在 mySQL 请求和 url 生成器中设置 LIMIT:

PHP

<?php
$link = mysql_pconnect("localhost", "user", "pass") or die("Could not connect");
mysql_select_db("dbase") or die("Could not select database");

//GET page/count
$count=10;$offset=0;
if (isset($_GET['count'])) $count=$_GET['count']*1;
if (isset($_GET['page']))  $offset=$_GET['page']*$count*1;

$arr = array();

$rs = mysql_query("SELECT * FROM bannersright 
                   ORDER BY HdOrder 
                   LIMIT $offset,$count"); #<-HERE

while($obj = mysql_fetch_object($rs)) {
$arr[] = $obj;
}

echo '{"bannersright":'.json_encode($arr).'}';

?>

JS:

$(function () {

        $("#wrapper #sidebar-right").autobrowse(

            {

                url: function (offset)
                {                   
                    return "http://www.mysite.com/json.php?count=10&page="
                           +Math.round(offset/10); // <-- AND HERE
                },
                template: function (response)
                {
                    var markup='';
                    for (var i=0; i<response.bannersleft.length; i++)
                    {
                        markup+='<a href="'+response.bannersleft[i].URL+'"><img src="'+response.bannersleft[i].Image+'" /></a>'
                    };
                    return markup;
                },
                itemsReturned: function (response) { return response.bannersleft.length; },
                offset: 0,
                max: 1,
                loader: '<div class="loader"></div>',
                useCache: false,
                expiration: 1
            }
        );

});