php - javascript动画表格更新内容

Question

我有一个 javascript 动画表，我希望它从另一个页面获取内容，并在将新记录添加到数据库时进行更新。

javascript:

var newitem = function(){
var item = $('<div>')
    .addClass('item')
    .css('display','none')
    .text('content.php')  -- Get the content somehow?
    .prependTo('#scroller')
    .slideDown();
$('#scroller .item:last').animate({height:'0px'},function(){
    $(this).remove();
});
}

setInterval(newitem, 2000);

内容.php：

include ('db.php');
$sql2 = "SELECT * FROM `feed` ORDER BY `timez` DESC";
$res2 = mysql_query($sql2) or die(mysql_error());
while($row3 = mysql_fetch_assoc($res2)){

$user = $row3['username1'];
$action = $row3['action'];
$user2 = $row3['username2'];

echo ''.$user.''.$action.''.$user2.'';

示例 ( http://jsfiddle.net/8ND53/ ) 我怎样才能使它与我的 php 一起工作，并使 javascript 仅在将新内容添加到数据库时进行动画和更新？

Answer 1

您需要为此使用Ajax

$.ajax({
    url : 'your data point in php',
    data : {data you want to send},
    dataType : 'application/json',
    success: function(response) {
        // Only when successful animate the content
        newItem(response);
    } 
});

var newitem = function(response){
    var item = $('<div>')
        .addClass('item')
        .css('display','none')
        .text(response)
        .prependTo('#scroller')
        .slideDown();
    $('#scroller .item:last').animate({height:'0px'},function(){
        $(this).remove();
    });
}