使用fadein并附加

Cou*_*lin 74 javascript jquery fade

我正在将JSON数据加载到我的页面并使用appendTo(),但我试图淡化我的结果,任何想法?

$("#posts").fadeIn();
$(content).appendTo("#posts");
Run Code Online (Sandbox Code Playgroud)

我看到append和appendTo在文档上有区别.

我也尝试过这个:

$("#posts").append(content).fadeIn();
Run Code Online (Sandbox Code Playgroud)

我明白了,上面做了伎俩!

但我得到"未定义"作为我的JSON值之一.

小智 169

如果在追加内容之前隐藏内容并将fadeIn方法链接到该内容,则应该获得您正在寻找的效果.

// Create the DOM elements
$(content)
// Sets the style of the elements to "display:none"
    .hide()
// Appends the hidden elements to the "posts" element
    .appendTo('#posts')
// Fades the new content into view
    .fadeIn();
Run Code Online (Sandbox Code Playgroud)

  • 谢谢你的帮助凯文 (2认同)

Par*_*and 7

我不知道我是否完全理解你所遇到的问题,但这样的事情应该有效:

HTML:

<div id="posts">
  <span id="post1">Something here</span>
</div>
Run Code Online (Sandbox Code Playgroud)

使用Javascript:

var counter=0;

$.get("http://www.something/dir",
    function(data){
        $('#posts').append('<span style="display:none" id="post' + counter + ">" + data + "</span>" ) ;
        $('#post' + counter).fadeIn();
        counter += 1;
    });
Run Code Online (Sandbox Code Playgroud)

基本上你将每个内容(每个"帖子")包裹在一个范围内,将该范围的显示设置为无,以便它不会显示,然后淡入.