如何使用jquery在容器中定位最近的类？

Question

我想定位最近的类，如果它是该部分要读取的最后一项，则停止定位其他类元素。这就是我想要实现的目标。

.is-child类将显示是否单击.parent类，并且仅显示最近的类。我已尝试使用.next()方法，但每次点击只显示1 .is-child个元素

这是我的代码：

    jQuery('li.current.parent').click(function(){
         jQuery(this).next('.is-child').css('display', 'block');
    });

我也尝试使用.nextAll但它会显示所有.is-child元素。

    jQuery('li.current.parent').click(function(){
         jQuery('.is-child').nextAll('.is-child').css('display', 'block');
    });

Answer 1

您需要使用.nextUntil选择元素 - 这将从$(this)中选择所有元素，直到指定的选择器（不包括$(this)和与选择器匹配的元素）：

$(function() {
  jQuery('li.current.parent').click(function(){
    jQuery(this).nextUntil('.parent').css('background-color', 'red');
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li class="current parent">click here</li>
  <li class="is-child">hi</li>
  <li class="is-child">hi</li>
  <li class="is-child">hi</li>
  <li class="parent">bye</li>
</ul>