我有一个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>