更改<div>部分的背景颜色

Question

更改<div>部分的背景颜色

我正在尝试使用按下按钮时jQuery更改部分的背景颜色<div>,下面是执行该操作的代码.为什么不工作？

HTML文件

<html>
<head>
<script type="text/javascript" src="jquery-1.6.4.js"></script>
<script type="text/javascript" src="script.js"></script>
<style type="text/css"> 
#name{
background-color: #FFFFF2;
width: 100px;
}
</style>
</head>
<body>
<input type="button" id="bgcolor" value="Change color"/>
<div id="name">
Abder-Rahman
</body>

</html>

Run Code Online (Sandbox Code Playgroud)

的script.js

$("bgcolor").click(function(){
    $("#name").animate(
        {backgroundColor: '#8B008B'},
        "fast");}
);

Run Code Online (Sandbox Code Playgroud)

谢谢.

Answer 1

And*_*ker 5

你有几个问题:

你的选择器错了: $("#bgcolor")
你错过了一个结束</div>标签.
你需要jQueryUI来制作动画background-color.

HTML:

<input type="button" id="bgcolor" value="Change color"/>
<div id="name">
Abder-Rahman
</div>

Run Code Online (Sandbox Code Playgroud)

JS:

$("#bgcolor").click(function(){
    $("#name").animate(
        {backgroundColor: '#8B008B'},
        "fast");}
);

Run Code Online (Sandbox Code Playgroud)

您的代码已修复(并包含jQueryUI):http://jsfiddle.net/andrewwhitaker/rAVj9/

归档时间：	14 年，11 月前
查看次数：	3376 次
最近记录：	14 年，11 月前