我正在尝试打开和关闭“timelineTile”div,如果打开另一个 div 也关闭,当单击背景时也关闭,如果单击另一个 div 和背景,我设法让它关闭,但我可以如果单击 div 本身,则让 div 关闭...这是我的 fiddle
我的代码;
$(function () {
$('.timelineTile').click(function (evt) {
evt.stopPropagation();
$('.selected').children().removeClass('clicked');
$(this).toggleClass('clicked');
});
$(document).click(function () {
$('.timelineTile').removeClass('clicked');
});
});
.timelineTile.clicked{
background:red;
width:500px;
height:300px;
-webkit-transition:height 1s, left 1s, -webkit-transform 1s;
transition:height 1s, left 1s, transform 1s;
}
.selected {
-webkit-transition:height 1s, left 1s, -webkit-transform 1s;
transition:height 1s, left 1s, transform 1s;
}
.timelineTile {
background:black;
color:white;
width:200px;
height:100px;
margin-bottom:20px;
-webkit-transition:height 1s, left 1s, -webkit-transform 1s;
transition:height 1s, left 1s, transform 1s;
}
.timelineTilehold {
background:pink;
}
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<ul class="timelineTilehold">
<li class="selected"><div class="timelineTile">hello
</div></li>
<li class="selected"><div class="timelineTile">hello
</div></li>
<li class="selected"><div class="timelineTile">hello
</div></li></ul>
最佳答案
使用 .not()
这样您就不会删除点击元素上的类
$('.timelineTile').click(function (evt) {
evt.stopPropagation();
$('.selected').children().not(this).removeClass('clicked');
关于jquery - 切换类不起作用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25936975/