jQuery使用append with effects

Question

如何将.append()与show('slow')之类的效果一起使用

对append产生影响似乎根本不起作用，而且它给出的结果与正常的show()相同。没有过渡，没有动画。

如何将一个div附加到另一个div，并对其产生slideDown或show('slow')效果？

Answer 1

在append上添加效果将不起作用，因为浏览器显示的内容会在附加div后立即更新。因此，将Mark B和Steerpike的答案结合起来：

在实际追加之前，将要追加的div样式设置为隐藏。您可以使用内联或外部CSS脚本完成此操作，或者只需将div创建为

<div id="new_div" style="display: none;"> ... </div>

然后，您可以将效果链到您的append (demo)：

$('#new_div').appendTo('#original_div').show('slow');

或(demo)：

var $new = $('#new_div');
$('#original_div').append($new);
$new.show('slow');

Answer 2

本质是这样的：

1. 您正在父
2. 上调用'append‘，但您想要在新子

上调用’‘

这对我来说很有效：

var new_item = $('<p>hello</p>').hide();
parent.append(new_item);
new_item.show('normal');

或者：

$('<p>hello</p>').hide().appendTo(parent).show('normal');

Answer 3

处理传入数据(如来自ajax调用)时的另一种方法：

var new_div = $(data).hide();
$('#old_div').append(new_div);
new_div.slideDown();