jquery, trouver l'élément suivant par classe

102

Comment puis-je trouver l'élément suivant par classe.

J'ai essayé avec $(obj).next('.class');mais cela renvoie les classes uniquement chez le $(obj)parent. Je dois prendre l'élément suivant n'importe où dans le code par nom de classe. Parce que mon code ressemble à

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

Est-ce possible?

Alex
la source

Réponses:

147

Dans ce cas, vous devez remonter à l' utilisation <tr> puis.next() , comme ceci:

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

Ou s'il peut y avoir des lignes entre les deux sans l' .classintérieur, vous pouvez utiliser .nextAll(), comme ceci:

$(obj).closest('tr').nextAll(':has(.class):first').find('.class');
Nick Craver
la source
Ce serait plus simple de faire ceci: $ (obj) .closest ('tr'). NextAll ('. Class') [0];
StuR
2
@StuR - cela ne fonctionnerait pas ici, puisque .nextAll () ne regarde que les éléments frères. Vous avez besoin de quelque chose qui regarde les descendants pour trouver la prochaine <div> que la question veut.
Nick Craver
1
Et si vous vouliez obtenir un attribut de cet objet HTMLObject renvoyé? Like an$(obj).closest('tr').nextAll('.class')[0].attr('data-attribute');
Dennis Braga
Vous devrez peut-être aussi utiliser: .parent (). Next ("") si l'élément n'a pas de frères
shasi kanth
@NickCraver You are awesome
THE HOLY SPIRIT
23

Pour trouver l'élément suivant avec la même classe:

$(".class").eq( $(".class").index( $(element) ) + 1 )
plavozont
la source
13

Vous ne pouvez pas utiliser next () dans ce scénario, si vous regardez la documentation qui dit:
Next () Obtenez le frère immédiatement suivant de chaque élément de l'ensemble des éléments correspondants. Si un sélecteur est fourni, il récupère le frère suivant qui correspond au sélecteur.

donc si le deuxième DIV était dans le même TD, vous pouvez coder:


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

Mais comme ce n'est pas le cas, je ne vois pas de point à utiliser next (). Vous pouvez à la place coder:

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

Morteza Manavi
la source
6
Mais comment trouve-t-il l'élément suivant. .find renverrait tous les éléments.
Shashwat Kumar