我有一个div,有一个特定的风格(让我们说一定的背景)。
我想要的是,当一个单击具有该div的列表元素应用另一种特定样式(另一种背景类型)来应用于该div时,
如果单击属于该div的不同元素中的另一个区域,则不应更改样式。
是否可能使用jquery?谢谢!
编辑:(我的功能也做了一些其他的事情,但改变的颜色不会像我想要的那样工作,它改变了我点击的所有项目的背景,不仅是最后一次点击。)
$(document).ready(function() { $('.product_types > li').click(function() { $(this) .css('backgroundColor','#EE178C') .siblings() .css('backgroundColor','#ffffff'); $('#submit_button').removeAttr('disabled'); $('#number').removeAttr('disabled'); }); });
解决方法
正如我对你的问题所了解的,这就是你想要的。
这是下面的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; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> <div id="divParent1" class="parentDiv"> Group 1 <div id="child1" class="childDiv"> Child 1 </div> <div id="child2" class="childDiv"> Child 2 </div> </div> <div id="divParent2" class="parentDiv"> Group 2 <div id="child1" class="childDiv"> Child 1 </div> <div id="child2" class="childDiv"> Child 2 </div> </div>