[英]this parent jQuery
jQuery jQuery
$(".drop-down h3").click(function(e) {
e.preventDefault();
$(this).parent(".drop-down").find($("ul")).stop().slideToggle();
$(this).parent(".drop-down").find($(".divider-aside")).stop().toggle("slow");
$(this).parent(".drop-down").find($(".arrow")).stop().toggleClass("rotate1 rotate2");
});
HTML HTML
<div id="categories">
<div class="drop-down">
<h3>Categories</h3>
</div>
<div class="divider-aside"></div>
<ul>
<li>123</li>
<li>12323</li>
<li>1231</li>
<li>523</li>
<li>31</li>
</ul>
</div>
I'd like to hide everything in .drop-down
class excluding <h3>
by clicking on <h3>
.我想通过点击
<h3>
来隐藏.drop-down
类中除<h3>
之外的所有内容。 In this case only .arrow
toggleClass works.在这种情况下,只有
.arrow
toggleClass 有效。
Use closest
instead of parent
使用
closest
而不是parent
$(this).closest("#categories")
parent will only go back 1 level , ie, the immediate parent. parent 只会返回 1 level ,即直接父级。 But you gotta get the container that encloses all the 3 elements
但是你必须得到包含所有 3 个元素的容器
So $(this).parent(".drop-down")
所以
$(this).parent(".drop-down")
supposed to be either应该是
$(this).parent().parent() // this will break if there is an extra
// parent container gets added
or或者
$(this).closest("#categories") // This will work even if the no of
// parent container keep chaning
if you need toggle them all but the .drop-down .siblings is just what you need如果您需要全部切换,但 .drop-down .siblings 正是您所需要的
$("div.drop-down > h3").click(function(){
var $t = $(this);
$t.parent().siblings().toggle();
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.