javascript - 相对于另一个元素定位下一个元素

Question

基本上，以一种非常示意性的方式，我需要定位第一个相对于获得事件的元素具有特定属性的元素。

<div data-path="2" class="section">
  ... Nope.
</div>

<div data-path="1" class="section">
  <a data-path="2" class="trigger" href="#">Foo</a>
</div>

<div data-path="1" class="section--2">
  ... Nope.
</div>

<div data-path="2" class="section--3">
 I need to target this one, but not the sections previous to the trigger.
</div>

<div data-path="2" class="section--4">
  ... Nope.
</div>

我不知道如何实现这一目标。这似乎很简单，但我两天来一直坚持这个问题。我尝试使用 .next() 和 .nextUntil() 但它无法正常工作。

欢迎任何帮助，对我的英语表示抱歉。

编辑:要明确的是，我需要的是当单击 .trigger 时，我需要定位具有相同数据路径属性的下一个部分，而不是触发器之前的部分。

Answer 1

您可能希望使用 nextAll 获取具有相同属性值的下一个元素，然后使用其中的第一个元素:

演示:http://jsfiddle.net/mUt9H/1/

相关代码:

$("a").on("click", function() {
    var dp = $(this).data("path");
    var txt = $(this).parent().nextAll("div[data-path='" + dp + "']").first().text();
    alert(txt);
});

您的触发器是一个 anchor ，因此首先您需要到达其父级 div，然后遍历到下一个元素。因此，$(this).parent()...。

编辑:(关于您的评论)

只需将 .first() 链接到该语句即可。

.nextAll("div[data-path='"+ dp + "']").first()...