带有 jquery slidedown 的 PHP ajax

Question

我有一个复杂的 PHP 难题。我的数据库中有一个不断更新的表(让我们称之为 TABLE)，每秒添加多条记录，这些结果将使用 PHP 在使用 AJAX 的页面 (page.php) 上发布。

显示的最大帖子数量是每三秒 1 个，对此我有一个相关性算法。我不知道如何将 jquery 转换与表中不断更新的记录(通过 AJAX 获得)合并。我想出的最好的方法并不比 hack 好多少，并且不能容纳无限数量的职位。

J查询:

$(#5).delay(1000).slideDown(700);
$(#4).delay(4000).slideDown(700);
$(#3).delay(8000).slideDown(700);
$(#2).delay(12000).slideDown(700);
$(#1).delay(16000).slideDown(700);

PHP: 不需要

HTML:

<div id='5' class='post'></div>
<div id='4' class='post'></div>
<div id='3' class='post'></div>
<div id='2' class='post'></div>
<div id='1' class='post'></div>

我不知道如何使用 AJAX。

如有任何帮助，我们将不胜感激

谢谢

Answer 1

如果您的问题只是如何向下滑动最新附加的 div，请尝试以下操作:

HTML:

<div id="updatePanel">
    <div id='div5' class='post'></div>
    <div id='div4' class='post'></div>
    <div id='div3' class='post'></div>
    <div id='div2' class='post'></div>
    <div id='div1' class='post'></div>
</div>

注意:以数字开头的id属性是无效的。

jQuery

setInterval(getData, 3000);

function getData() {
    // call ajax, get data.
    // success: function () {...
    var id = parseInt($("#updatePanel div:first").attr("id").replace("div", "")) + 1;

    $div = $("<div></div>").attr("id", id)
        .addClass("post")
        .text(dataFromAJAX)
        .css("display", "none") // change this to be a class - this is just to make it clear.
        .prependTo("#updatePanel")
        .slideDown();
}

Example fiddle