Question

我有一个div结构，我无法更改。在outer-container中有两个inner-container。我想切换inner-container2。该按钮位于第一个inner-container中。

此结构一次又一次重复。因此，我无法选择类名（inner-container2）。此类名称经常出现。

我必须选择类似以下内容：从按钮上移一个级别，然后进入下一个div

<div class="outer-container">
  <div class="inner-container1">
    <div class="button">
    </div>
  </div>
  <div class="inner-container2">
  </div>
</div>

这个小组一次又一次地来。

我想要一个以单击按钮开头的脚本并仅在同一组中打开inner-container2。

$(document).on('click', '.button', function(){
  $('?????').toggle('slow');
});

Answer 1

$(document).on('click', '.button', function() {
  $(this).parent().next().toggle('slow');
});

.inner-container2{
  background-color:gray;
  height : 50px;
  width : 50px
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="outer-container">
  <div class="inner-container1">
    <div class="button">
      <button>BUTTON1</button>
    </div>
  </div>
  <div class="inner-container2"></div>
</div>

我使用您的代码作为示例，只是添加了CSS来定义功能。

jQuery选择器的父母和兄弟姐妹

1 个答案: