编程语言
首页 > 编程语言> > javascript-此父jQuery

javascript-此父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

<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>

我想隐藏.drop-down类中的所有内容,但< h3>通过点击< h3>.在这种情况下,仅.arrow toggleClass有效.

解决方法:

使用最接近而不是父代

$(this).closest(".categories")

父级只会返回1级,即直接父级.但是你必须得到包含所有三个元素的容器

因此$(this).parent(“.drop-down”)

应该是

$(this).parent().parent()   // this will break if there is an extra
                            // parent container gets added

要么

$(this).closest(".categories") // This will work even if the no of
                               // parent container keep chaning

标签:this,parent,javascript,jquery
来源: https://codeday.me/bug/20191122/2063696.html