Javascript jQueryUI动画（颜色）不'；行不通

我想为输入元素的背景色设置动画，但不起作用：(

JavaScript（提交时）：

函数sendImage（）{ formularz=$（'form#sendImage'）； autor=formularz.children（'input[name=autor]'）； 如果（autor.val（）.length<1 | | autor.val（）.length>20）{ console.log（'start'）； 自动动画({ 背景颜色：“红色”， 宽度：“100px”， }，3000，函数（）{ console.log（'end'）； }); } } jQuery liblaries：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>

<link rel="stylesheet" href="jquery-ui/jquery-ui.min.css">
<script src="jquery-ui/external/jquery/jquery.js"></script>
<script src="jquery-ui/jquery-ui.min.js"></script>
<!-- I tried also this -->
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>

在JS函数中工作良好-控制台中显示日志，元素的宽度也在变化，但背景颜色并没有变化，并且在控制台中并没有显示任何错误

---

有什么建议吗？

jQuery默认情况下无法设置背景颜色的动画。您有两个选项，第一个选项可以使用第三方插件。第二个选项可以使用CSS。后者更可取。下面介绍如何通过在元素上设置

转换

CSS规则，然后在jQuery代码中添加类来实现

input {
    transition: all 3s;
}
input.error {
    background-color: red;
}

函数sendImage（）{ var$formularz=$（'form#sendImage'）； var$autor=$formularz.children（'input[name=autor]'）； 如果（$autor.val（）.length<1 | |$autor.val（）.length>20）{ $autor.addClass（'error'）； } }

---

我非常确定，在Javascript中，您需要通过元素的id向元素添加样式。因此，如果您将元素的id设置为autor，则可以在if语句中使用以下命令：

document.getElementById('autor').style.background-color="red";

---

Rory McCrossan，我测试了你的建议，并且

'backgroundColor'

运行良好，但后来我想再次检查

backgroundColor

，它也运行正常

所以我不知道出了什么问题。可能是因为打字错误或者我忘了思考。

---

很抱歉造成混淆。

它不应该是

背景色

而不是

背景色

？@noob如果使用属性名作为文本，那么您不能包含

-

，因为它无效，所以您需要使用字符串。jQuery足够聪明，它可以接受CSS属性或DOM样式属性因此，在这种情况下，以下任何一项都会起作用：

'background-color'

，

backgroundColor

，

'backgroundColor'

@Invictus请注意，您包含了jQuery和jQueryUI的多个版本-您应该分别删除其中一个。但这没有动画（猜测）。

document.getElementById('autor').style.background-color="red";