11545 sujets

JavaScript, DOM et API Web HTML5

[RESOLU] [JQuery] Cibler un élément "suivant"

Bonjour,
Mettons mon code :
<a href="#">Lien</a>
<div></div>

Est-il possible de cibler le div (qui n'a aucun lien direct avec le lien, ni enfant, ni parent...) en agissant sur le lien, sans personnaliser par une ID le div. Il faut imaginer que je peux avoir ce duo de balises répété une dizaine de fois, ce qui rendrait le code un peu lourd, aussi bien côté JQuery que html, si je devais personnaliser chaque div.
Le but est donc qu'en cliquant sur le lien, le code comprenne "va cibler la prochaine div sur ton chemin" (pas les suivantes).
J'avais bien tenté div:eq(0), mais chaque lien va cibler la première div de la page, et non la prochaine relativement à elle.
Je pensais utiliser du "next", mais manifestement ça n'existe pas en tant que sélecteur.

Bref, est-ce que cette manip est possible, et si oui comment ?

Merci d'avance.
Modifié par Ralf (30 Nov 2009 - 13:14)
Ralf a écrit :
Hmm, non, ça ne marche pas

Peut-on voir le code complet? La solution proposée par Register devrait normalement fonctionner…
Et bien par exemple, quelque chose comme ça :
<a href="#">lien1</a>
<div></div>

<a href="#">lien2</a>
<div></div>

<a href="#">lien3</a>
<div></div>
etc.


Couplé à ça :
$('document').ready(function() {
	  $('a').click(function () {
          
          $(this).next('div').addClass('couleur_test');

           });
});
Ah ben effectivement, mon exemple marche très bien.

J'ai remarqué une petite différence dans mon code original, qui fait foirer tout le truc.
Les balises <a> sont dans des balises <p>, ce qui donne quequechose comme :
<p><a href="#">lien1</a></p>
<div></div>


Même si j'ai eu la réponse à ma principale question, j'aimerais tout de même savoir comment régler ce dernier petit problème, et parvenir à viser l'élément div, dans ce cas.

Merci encore.
Bonjour,

Ralf a écrit :
j'aimerais tout de même savoir comment régler ce dernier petit problème

En utilisant la documentation de jQuery, par exemple?
La section qui t'intéresse est la suivante:
http://docs.jquery.com/Traversing

Tu devrais pouvoir faire cela:
$(this).parent().next()

Modifié par Florent V. (30 Nov 2009 - 12:49)
bonjour, je remonte le sujet car je suis également bloqué...


<h2>Cliquez pour faire apparaitre la description</h2>
<p>lorem</p>
<p>ipsum</p>
<dl>
  <dt>Autonomie</dt>
  <dd>2 heures</dd>
  <dt>couleur</dd>
  <dd>noire</dd>
</dl>


j’aimerais faire apparaitre ma <dl> en cliquant sur le h3, mais en mettant

$(this).next('dl').slideDown(500);

rien ne se passe Smiley decu
Modifié par Noisequik (26 May 2010 - 13:51)
Sujet clos
Aller à