HTML

Question

我希望从php文件中获取一些文本并使用jquery在浏览器上显示，这样每次新行将添加到其他行并且淡入效果：我写了一个类似的脚本：

$(function() {
    setInterval(function() {
    var html = $("#response").load("new_feed.php");
    $("#foo").append("<div>"+html+"</div>");
    $("#foo").fadeIn('slow');
}, 1000);
}

<div id="foo" align="left"></div>

但它只是一次创建一个div并显示输出，如：

[object Object]
[object Object]
[object Object]
...
[object Object]

Answer 1

您必须使用新创建的div，并将fadeIn效果应用于#foo。试试这个：

$(function() {
    setInterval(function() {
        $.get("new_feed.php", function(result) {
            $("<div></div>")
                .hide()
                .html(result)
                .prependTo("#foo")
                .fadeIn("slow");
        });
    }, 1000);
});

如您所见，我使用.get()而不是.load()。因为.load()函数会将内容加载到匹配的选择器。在你的情况下，它会从new_feed.php尝试将内容加载到#response（我不知道它是否存在）。

.load()函数返回jQuery对象，因此当您将其分配给html变量时，您会看到[object Object]。

Answer 2

您是否尝试过$.prepend()或$.prependTo()？

HTML

<div id="foo"></div>

的jQuery

$(function() {
    setInterval(function() {
        $("<div/>").hide().load("http://fiddle.jshell.net/salman/KPG9M/show/", function() {
            $(this).prependTo("#foo").fadeIn("slow");
        });
    }, 5000);
});

Demo

Answer 3

它也可能像这样工作。看看吧。

$("#foo").append("<div>"+html+"</div>").show('slow');

                         OR

$("#foo").append("<div>"+html+"</div>").fadeIn('slow');

这对你有帮助..

感谢。

Answer 4

那是因为您使用不当。我会试着解释一下。基本上html现在被设置为jquery对象，而不是实际的响应。你正在做的是将html加载到具有id响应的节点中。你应该可以做类似

的事情

var html = ''
$().load("new_feed.php",  function(response, status, xhr) {
   html = response;
});

此外，这可能也有效，因为html是jquery节点，请尝试这样做。

$(function() {
    setInterval(function() {
    var node = $("#response").load("new_feed.php");
    $("#foo").append("<div>"+node.html()+"</div>");
    $("#foo").fadeIn('slow');
}, 1000);
}

<div id="foo" align="left"></div>

使用具有淡入效果的jquery创建div

4 个答案:

HTML

的jQuery

Demo