jquery, finde das nächste Element nach Klasse


102

Wie finde ich das nächste Element nach Klasse?

Ich habe es mit versucht, $(obj).next('.class');aber dies gibt Klassen nur in $(obj)Eltern zurück. Ich muss das nächste Element irgendwo im Code nach Klassennamen nehmen. Weil mein Code so aussieht

<table>
<tr><td><div class="class">First</div></td></tr>
<tr><td><div class="class">Second</div></td></tr>
</table>

Ist das möglich?

Antworten:


145

In diesem Fall müssen Sie die gehen <tr> dann Verwendung .next(), wie folgt aus :

$(obj).closest('tr').next().find('.class');

Oder wenn es dazwischen Zeilen ohne .classInnenseite gibt, können Sie Folgendes verwenden .nextAll():

$(obj).closest('tr').nextAll(':has(.class):first').find('.class');

Dies wäre einfacher: $ (obj) .closest ('tr'). NextAll ('. Class') [0];
StuR

2
@StuR - das würde hier nicht funktionieren, da .nextAll () nur Geschwisterelemente betrachtet. Sie benötigen etwas, das Nachkommen betrachtet, um das nächste <div> zu finden, das die Frage haben möchte.
Nick Craver

1
Und was ist, wenn ein Attribut von diesem HTMLObject zurückgegeben werden soll? Wie ein$(obj).closest('tr').nextAll('.class')[0].attr('data-attribute');
Dennis Braga

Möglicherweise müssen Sie auch Folgendes verwenden: .parent (). Next (""), wenn das Element keine Geschwister hat
shasi kanth

23

So finden Sie das nächste Element mit derselben Klasse:

$(".class").eq( $(".class").index( $(element) ) + 1 )

13

Sie können next () in diesem Szenario nicht verwenden, wenn Sie sich die Dokumentation ansehen, in der steht:
Next () Holen Sie sich das unmittelbar folgende Geschwister jedes Elements in der Gruppe der übereinstimmenden Elemente. Wenn ein Selektor bereitgestellt wird, ruft er das nächste Geschwister ab, das dem Selektor entspricht.

Wenn sich der zweite DIV im selben TD befindet, können Sie Folgendes codieren:


// Won't work in your case
$(obj).next().filter('.class');

Aber da dies nicht der Fall ist, sehe ich keinen Punkt, den ich als nächstes verwenden könnte (). Sie können stattdessen Folgendes codieren:

$(obj).parents('table').find('.class')


6
Aber wie findet es das nächste Element? .find würde alle Elemente zurückgeben.
Shashwat Kumar
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.