在无限滚动上使用 AJAX 和 PHP 从表中获取结果?

Posted

技术标签:

【中文标题】在无限滚动上使用 AJAX 和 PHP 从表中获取结果?【英文标题】:Get results from table using AJAX and PHP on infinite scroll? 【发布时间】:2012-12-07 06:21:20 【问题描述】:

我正在尝试使用 AJAX 和 php 即时从我的表中获取 20 个结果(当用户滚动到底部时)。

到目前为止,我已经知道了……

AJAX

// Infinite Scroll
loadData( 0 );
//Hide Loader for Infinite Scroll
$('div.ajaxloader').hide();

);

function loadData ( last_id ) 
    var $entries = $('.directory'),
        $loader = $('.ajaxloader', $entries).show();
    $.get( '/getentries.php',  last_id : last_id , function( data ) 
        $entries.append( data ).append( $loader.hide() );
        filterEntries();
    );
;


//Isotope filter - no changes to this code so I didn't include it

$(window).scroll(function () 
    if ($(window).scrollTop() >= $(document).height() - $(window).height() - 10) 
        $('div.ajaxloader').show('slow');
        loadData( $( '.directory item:last' ).data('id') )
    

PHP

try 
  // Connect and create the PDO object
  $conn = new PDO("mysql:host=$hostdb; dbname=$namedb", $userdb, $passdb);
  $conn->exec("SET CHARACTER SET utf8");      // Sets encoding UTF-8

  // Define and perform the SQL SELECT query
  $sql = "SELECT * FROM `directory` WHERE user_active != ``";
  $result = $conn->query($sql);

  $sth = $conn->prepare("SELECT * FROM directory WHERE user_active != ''");
        $sth->execute(array(':county' => $county));

        $c = 1;
        while ($row = $sth->fetch(PDO::FETCH_ASSOC)) 
            echo '<div class="entry';
                 if (($c % 4) == 1) echo ' alpha ';
           // ECHO RESULT STYLES ETC HERE
        $c++;
        

  $conn = null;        // Disconnect

catch(PDOException $e) 
  echo $e->getMessage();

现在我的 AJAX 和查询似乎工作正常,但我遇到的问题是它只是再次提取所有记录,而不是接下来的 20 条记录?

我以前从未这样做过,如果我听起来很天真,很抱歉,但任何帮助将不胜感激!

【问题讨论】:

你应该看看谷歌上的pageless关键字。 您的 prepare() 与您的 execute() 不匹配,它应该会告诉您。 LIMIT 只会给你前 20 行。你需要抵消。在下面阅读我的答案,不要忘记投票。 :D 【参考方案1】:

您需要在 mysql 查询中添加限制。请看下面的代码

// Infinite Scroll
loadData( 0 );
//Hide Loader for Infinite Scroll
$('div.ajaxloader').hide();

);

function loadData ( last_id ) 
    var $entries = $('.directory'),
        $loader = $('.ajaxloader', $entries).show();
    $.get( '/getentries.php?startp=0&endp=20',  last_id : last_id , function( data ) 
        $entries.append( data ).append( $loader.hide() );
        filterEntries();
    );
;


//Isotope filter - no changes to this code so I didn't include it

$(window).scroll(function () 
    if ($(window).scrollTop() >= $(document).height() - $(window).height() - 10) 
        $('div.ajaxloader').show('slow');
        loadData( $( '.directory item:last' ).data('id') )
    


PHP


try 
  // Connect and create the PDO object
  $conn = new PDO("mysql:host=$hostdb; dbname=$namedb", $userdb, $passdb);
  $conn->exec("SET CHARACTER SET utf8");      // Sets encoding UTF-8

  // Define and perform the SQL SELECT query
  $sql = "SELECT * FROM `directory` WHERE user_active != ``";
  $result = $conn->query($sql);

  $sth = $conn->prepare("SELECT * FROM directory WHERE user_active != '' limit $_REQUEST['startp'],$_REQUEST['endp']");
        $sth->execute(array(':county' => $county));

        $c = 1;
        while ($row = $sth->fetch(PDO::FETCH_ASSOC)) 
            echo '<div class="entry';
                 if (($c % 4) == 1) echo ' alpha ';
           // ECHO RESULT STYLES ETC HERE
        $c++;
        

  $conn = null;        // Disconnect

catch(PDOException $e) 
  echo $e->getMessage();

谢谢 里帕萨哈

【讨论】:

【参考方案2】:

SELECT * FROM foo WHERE id &gt; $lastIndex ORDER BY id LIMIT 20;

编辑:哎呀。那是针对常规 mysql,而不是使用准备好的语句。根据php docs,您的答案应该如下所示:

$sql = "SELECT * FROM directory WHERE id > :lastIndex AND user_active != '' LIMIT 20";
$sth = $conn->prepare($sql);
$sth->execute(array(':lastIndex' => $lastIndex));

它的作用是抓取$lastIndex 之后的接下来的 20 个结果。您需要做的就是将 lastIndex 的值(应该与页面上的结果数一致)与您的请求一起发送并相应地使用它。

或者,您也可以反过来将$lastIndex 与您的结果一起发送到客户端,以便在用户发出新请求时存储和使用javascript

【讨论】:

感谢@Akamaozu,我尝试了以下没有结果... $lastindex = 2; $sth = $conn->prepare("SELECT * FROM directory WHERE id > $lastIndex AND user_active != '' LIMIT 5;"); $sth->execute(); 针对 PDO 示例进行了编辑。原始的设置为常规的 mysql 查询。 对。 $sql 行有一个错字。现在修复它。【参考方案3】:

嗯,简短的回答是为您的查询添加偏移量。就像分页一样。您只需跟踪您所在的页面并将查询偏移某个值。在这种情况下,您无需更改页面,而是在最后加载它。 Here is an example你可以google一下,了解更多

【讨论】:

以上是关于在无限滚动上使用 AJAX 和 PHP 从表中获取结果?的主要内容,如果未能解决你的问题,请参考以下文章

在无限滚动Wordpress帖子中包含脚本

MySQL:PHP:由于警告,无法从表中获取数据

如何从表中获取所有数据,包括表 ID

AJAX 未将用户输入从表单发送到 PHP 脚本

Woocommerce在使用ajax“无限滚动”之后在新选项卡中打开产品链接

Laravel使用无限滚动分页