0

我的代码示例：

<section id="reports">

  <div class="report">
    <div class="report-expand">MORE</div> <!-- this one is clicked -->
  </div>
  <ul class="report-moreinfo"></ul> <!-- I want to select this one -->

  <div class="report">
    <div class="report-expand">MORE</div>
  </div>
  <ul class="report-moreinfo"></ul>
  <div class="report">
    <div class="report-expand">MORE</div>
  </div>
  <ul class="report-moreinfo"></ul>

</section>

这是我的 jQuery 的一部分：

$('.report').on('click', '.report-expand', function(e) {
  // $(this) === '.report-expand'
  $(this).closest('.report') // now what..?
}

如何完成遍历以正确选择我当前选择的ul.report-moreinfo内容.report？

4

4 回答 4

4 
$(this).closest('.report').next();

因为列表是下一个兄弟。如果你想获得前一个兄弟姐妹，你会使用.prev.
更多信息：http ://api.jquery.com/next/，http : //api.jquery.com/prev/。

这是所有遍历方法的列表。

由于无论如何您将事件处理程序绑定到.report元素，您也可以使用 ofevent.delegateTarget而不是$(this).closest(...)：

$(event.delegateTarget).next();
于 2013-06-05T09:15:33.193 回答
0

您可以使用.next([selector])函数。像这样的东西：

$(this).closest('.report').next('ul.report-moreinfo');

但既然div.report是你的父母div.report-expand可以这样做：

$(this).parent().next('ul.report-moreinfo');

或者使用点击事件回调提供的delegateTarget：

$(e.delegateTarget).next('ul.report-moreinfo');
于 2013-06-05T09:18:43.093 回答
0

你可以用这个

  $(this).parent().next()

$(this).parent()会给report div

于 2013-06-05T09:15:27.853 回答
0

您可以使用：

$(this).parent().next();

出于性能原因，使用.parent()优于使用.closest()，只要.report-expand始终是.report.

编辑：在查看了其他答案后，我认为$(event.delegateTarget).next();Felix Kling 首先建议的 是最有效的查询。

于 2013-06-05T09:18:05.173 回答