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?

Alex
quelle

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');
Nick Craver
quelle
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 )
Plavozont
quelle
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')

Morteza Manavi
quelle
6
Aber wie findet es das nächste Element? .find würde alle Elemente zurückgeben.
Shashwat Kumar