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を使用することもできます:event.delegateTarget$(this).closest(...)

$(event.delegateTarget).next();
于 2013-06-05T09:15:33.193 に答える
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 に答える
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 に答える