jquery - 如何使用 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>