为页面加载时不存在的内容设置动画答案

【问题标题】：Animate something that doesn't exist on page load为页面加载时不存在的内容设置动画
【发布时间】：2013-02-02 02:49:31
【问题描述】：

Ajax 设置一个场景，然后 jQuery 将其播放出来。该元素在页面加载之前不存在。我需要一种方法来对动态添加到页面的内容进行动画处理。

类似：

$(document).on("animate", "div", function (){});

这样的事情存在吗？

好的，似乎有些混乱，我正在使用 queue() 这不是创建它或在我返回 ajax 后做某事的问题。在 Ajax 之后，程序构建并插入具有特定 ID 的 imgs 到页面中。我需要重新加载 dom 或其他东西，以便我可以为插入到页面中的对象设置动画。

我已经在 JSfiddle 上测试了动画并且它们工作正常，所以我唯一的假设是因为这些对象不是初始 dom 的一部分，它们不会动画，因此我需要重新加载 DOM。

【问题讨论】：

【解决方案1】：

您所要做的就是使用适当的功能对其进行动画处理，例如：

$("#nonexistent-element").animate({
  right: '10%'
});

一旦存在#nonexistent-element，它就会动画，无论它在页面加载时是否存在。仅当您想将事件绑定到页面加载时不存在的元素时才需要使用 on()。

【讨论】：

【解决方案2】：

当通过 Ajax 加载内容时，我们需要绑定事件以使其工作，或者我们可以使用 jQuery 的 live/on 方法，根据我们的需要将事件绑定到父/文档。

两种技术中的任何一种，即在加载内容时绑定或使用 live/on 都应该导致事件被触发。

例如：插入内容后，我们可以按照上述答案中 Lrdwhyt 的建议进行操作。或者我们在加载之前绑定元素，就像

$("#non-existing-elem").live("click",function(){
     $(this).animate({right:'10'});
})

【讨论】：