Question

我打开了帖子，我在那里请求了jquery代码的帮助： How to find the closest event element

不幸的是，其他用户没有阅读我的问题。

我有一个链接。点击它将显示/切换div。我的问题是我的div并不总是位于A链接的同一级别。有时隐藏DIV的A链接是1级。有时它是2级或更多。有时它低于它

如何在A链接中找到包含“.hidebox”类的最近DIV？

 <a href="#" class="hideBox-tab " >show div</a>

$(".hideBox-tab").click(function(){
    $(this)
        .parent().parent()
        .find(".hideBox")
        .toggle();
    return false;
});

Answer 1

如果您和<a>显示/切换div，<a>必须在div之外：

<a href="#" class="hideBox-tab">toggle and show div</a>
<div class="hideBox">
  Content here  
</div>

然后，您需要在HTML中找到一个标记，该标记始终包含a.hideBox-tab和div.hideBox。例如：div.partial-content：

<div class="partial-content">
  <a href="#" class="hideBox-tab">toggle and show div</a>
  <div class="hideBox">
    Content here  
  </div>
</div>

你的JS将是这样的：

$(".hideBox-tab").click(function(){
    $(this).closest(".partial-content").find(".hideBox").toggle();
});

我创建了一个代码段，看看它：

$(".hideBox-tab").click(function(){
    $(this).closest(".partial-content").find(".hideBox").toggle();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="partial-content">
  <a href="#" class="hideBox-tab">toggle and show div</a>
  <div class="hideBox">
    Content here  
  </div>
</div>

<div class="partial-content">
  <a href="#" class="hideBox-tab">toggle and show div</a>
  <div>
    <div class="hideBox">
      Content 2 here  
    </div>
  </div>
</div>

此解决方案适用于a.hideBox-tab和div.hideBox之间的一个或多个级别。

如何找到最接近的事件元素2

1 个答案: