PHP Ajax mit jquery slidedown

Question

Ich habe eine komplizierte PHP-Rätsel. Ich habe eine ständig aktualisierende Tabelle in meiner Datenbank (Lets call it TABLE) mit mehreren Datensätzen, die eine Sekunde hinzugefügt werden, diese Ergebnisse werden mit PHP auf einer Seite (page.php) mit AJAX veröffentlicht.

Die maximale Anzahl der angezeigten Beiträge ist 1 alle drei Sekunden, für die ich einen Relevanzalgorithmus habe. Ich weiß nicht, wie man die jQuery-Übergänge mit den ständig aktualisierten Datensätzen aus der Tabelle (Got by AJAX) zusammenführt. Das Beste, was ich mir ausgedacht habe, ist nicht viel besser als ein Hack und passt nicht zu einer unendlichen Anzahl von Beiträge.

JQuery:

$(#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:

<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> 

Ich weiß nicht, was mit AJAX zu tun: Nicht

HTML erforderlich.

Jede Hilfe wäre sehr geschätzt,

dank

Answer 1

Wenn Ihre Frage einfach ist, wie die neueste angehängte div slidedown, versuchen Sie dies:

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> 

Hinweis: id Attribute mit Nummern beginnend ungültig sind.

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

Answer 2

Ich bin nicht sicher, aber ist dies grundsätzlich für neue Stellen alle drei Sekunden überprüft, und nach unten, sie mit einer Folie dann angezeigt wird?

Wenn dies der Fall ist, fügen Sie, nachdem Sie die neuen Posts mit Ajax gezogen haben, den Code an einen Wrapper-Container an, stellen Sie div auf hidden ein und schieben Sie ihn nach unten.

Ich kann mit Code helfen, wenn dies das ist, was Sie wollen, aber Sie müssen Ihren Ajax veröffentlichen, damit ich eine bessere Idee bekommen kann.