jQuery .animate()似乎一次只能处理一个元素

jQuery .animate() only seems to work on one element at a time?

本文关键字：处理 一个 元素 animate jQuery 一次      更新时间：2023-09-26

我有一些动态创建的元素，应该是动画的。只要你在动画结束前不启动另一个动画，动画就可以正常工作。

这是我的一个模拟设计的演示。

它工作得很好，但如果你点击"POST!"，你会看到前面的气泡没有完全完成动画。相反，他们只是中途停止。如果你改变动画速度，它会变得更加明显。

有人知道是什么引起的吗?

我复制了您的代码并将其放入jsfiddle: http://jsfiddle.net/mau3J/

你的问题出在这一行:

$('#chatbox').html( html+$('#chatbox').html() );

你本质上是用当时的#chatbox替换#chatbox中的所有内容，取消任何动画。

与jsfiddle链接中一样，替换为:

 $('#chatbox').prepend($(html));

这是添加到DOM而不是替换它。在$()中包装html变量会将其转换为jquery对象。

也可以作为侧通知， jQuery中的类可以在前面加句号来引用。你的代码在这里:

$('#chatbox').find('[class="chatbubble"]:first')

等价于

$('#chatbox .chatbubble:first')

阅读CSS选择器将帮助你理解jQuery符号的含义。

在jquery代码中使用if条件手动检查是否完成

相关文章：