jQuery背景颜色动画

Question

我有一个带有链接和 SPAN 的 DIV。

单击链接时，它会使用 AJAX 呈现项目列表。单击某个项目时，SPAN 的内容会发生更改。

我想通过将 DIV 的背景颜色设置为绿色并使用 jQuery 将其动画回白色来突出显示此更改。

  var originalColor = elementToUpdate.parentNode.style.backgroundColor;
  elementToUpdate.style.backgroundColor = 'green'; //lastSender.style.color;
  jQuery(elementToUpdate.id).animate({ backgroundColor: '#ffffff' }, 1000);

第 2 行 SPAN 的背景更改为绿色，但第 3 行没有执行任何操作。没有错误，也没有改变过什么......

有什么想法吗？

<小时/>

编辑:正如 Ted Naleid 在下面的评论中指出的:

Also note that you have to have the color animations plugin installed for this to work (http://plugins.jquery.com/project/color), if you don't have it installed, jQuery can't animate colors, only numeric properties (at least as of 1.3.1).

Answer 1

如果您已经拥有该元素，则不需要 .id。直接交给 jQuery:

jQuery(elementToUpdate).animate({ backgroundColor: '#ffffff' }, 1000);

您不会收到错误，因为 elementToUpdate.id 是一个字符串，jQuery(可能)将其解释为选择器。它只是碰巧是一个不选择任何内容的选择器。

或者，您可以这样说以使其成为有效的选择器:

jQuery('#' + elementToUpdate.id).animate({ backgroundColor: '#ffffff' }, 1000);

但我认为第一种形式更可取，因为您已经拥有元素本身。