按钮单击更改背景div

-1

我想要使用Jquery按钮单击更改div的backColor。目前，我正在通过改变我的班级来做到这一点。按钮单击更改背景div

这里是我的CSS：

.GreenColor 
{ 

background-color:#00FF00; 
} 

.RedColor 
{ 

background-color:#FF0000; 
}

这里是我的脚本在我的PHP文件：

<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.10.2.min.js"> 
</script> 
<script> 


$(document).ready(function(){ 


$("button").click(function() { 
    $(this).closest("div").toggleClass("RedColor").toggleClass("GreenColor"); 
}); 
}); 
</script>

但不知何故，它什么都不做。

在这里可以使用一些帮助;）

来源

2014-02-24 Nick Prozee

请添加相关的html代码 –

你是如何定义的按钮？也请显示HTML，请 – Nenotlep

您可能错过了“。”或“按钮”之前的“＃”符号。 – Schokea

可以尝试像

$("#button").click(function() { 
    $(this).closest("div").toggleClass("RedColor GreenColor"); 
});

甚至尝试像

$("#button").toggle(function() { 
    $(this).closest("div").removeClass("RedColor").addClass("GreenColor"); 
}, function() { 
    $(this).closest("div").removeClass("GreenColor").addClass("RedColor"); 
});

来源

2014-02-24 12:05:41 Gautam3164

抱歉没有发布html。 –

这就是答案。非常感谢 –

@NickProzee，所以你应该正式接受它。 – collapsar

使用.toggleClass（）使用第二参数用于确定是否为cl屁股应该被添加或删除。如果此参数的值为true，则会添加该类;如果为false，则该类为已删除。从本质上说，声明：

$("button").click(function() { 
     $(this).closest("div").toggleClass("RedColor GreenColor"); 
    });

来源

2014-02-24 12:06:07

的Jquery之证件说

，因为你应该使用$(':button')选择：

：按钮是一个jQuery的扩展，而不是部分的CSS规范，使用：按钮的查询无法利用本机DOM querySelectorAll（）方法提供的性能提升。要在使用按钮选择元素时实现的最佳性能，请首先使用纯CSS选择器选择元素，然后使用.filter（“：button”）。

看到小提琴：

http://jsfiddle.net/ravi441988/kE3W8/

来源

2014-02-24 12:13:35 Ravi

按钮单击更改背景div

回答

相关问题