jquery在点击时更改div的样式

我有一个div，具有特定的风格（让我们说一定的背景）。

我想要的是，当一个单击具有该div的列表元素时，应用另一个特定样式（另一个背景类型）来应用于该div，

如果单击属于该div的其他元素中的另一个区域，则该样式不应更改。

是否可以使用jquery？ 谢谢！

编辑:(我的function还做了一些其他的事情。但是改变的颜色并没有像我想的那样工作。它改变了我点击的所有项目的背景，而不仅仅是最后点击的。）

$(document).ready(function() { $('.product_types > li').click(function() { $(this) .css('backgroundColor','#EE178C') .siblings() .css('backgroundColor','#ffffff'); $('#submit_button').removeAttr('disabled'); $('#number').removeAttr('disabled'); }); }); 

Answer 1

正如我对你的问题所理解的那样，这就是你想要的。

这是下面的jsFiddle ：

 $('.childDiv').click(function() { $(this).parent().find('.childDiv').css('background-color', '#ffffff'); $(this).css('background-color', '#ff0000'); }); 

 .parentDiv { border: 1px solid black; padding: 10px; width: 80px; margin: 5px; display: relative; } .childDiv { border: 1px solid blue; height: 50px; margin: 10px; } 

  
 Group 1 
 Child 1 
 
 Child 2 
 
 
 Group 2 
 Child 1 
 
 Child 2 
  

Answer 2

你可以使用jquery的.css方法..

参考css方法

Answer 3

 $(document).ready(function() { $('#div_one').bind('click', function() { $('#div_two').addClass('large'); }); }); 

如果我理解你的问题。

或者你可以直接修改css：

 var $speech = $('div.speech'); var currentSize = $speech.css('fontSize'); $speech.css('fontSize', '10px'); 

Answer 4

如果我理解正确，您想通过单击ul列表中的项来更改元素的CSS样式。 我对吗？

HTML：

 
 
 
 
Red
 
Blue
 
#ffee99
  

jQuery的

 $('.colors-list li').click(function(e){ var color = $(this).text(); $('.results').css('background-color',color); }); 

请注意，如果要使用类而不是内联样式，jquery可以使用addClass ， removeClass和toggleClass 。 这意味着您可以执行以下操作：

 $('.results').addClass('selected'); 

并在CSS中定义“选定”样式。

工作示例： http ： //jsfiddle.net/uuJmP/