Discussion :

[momjunior]

Bonjour

J'ai une page html où j'ai placé 2 divs qui contiennent chacune des 3 éléments enfants: 1 img et 2 spans.

Je voudrais, après avoir cliqué sur l'image, récupérer le contenu des 2 spans.

Malheureusement j'arrive seulement à récupérer le 1er span,ce qui m'affiche juste "1000" comme résultat.

Voici mon code:

index.html

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
<div class="row">
  <img src="../images/galerie/batik/batik1.jpg" alt="image non disponible">
  <span class="px">1000</span>
  <span class="descrip">Description1 du produit</span>
</div>
 
<div class="row">
   <img id="batik3" src="../images/galerie/batik/batik2.jpg" alt="image non disponible">
   <span class="px">2000</span>
   <span class="descrip">Description2 du produit</span>
</div>

jquery.js

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
$('.row img').click(function() {
    var a = $( "img ~ span" ).html();
    console.log(a);
} );

J'aimerai donc récupérer tous les éléments enfants de "row" après la balise "img".

Merci

[SpaceFrog]

d'abord en passant par $(this) pour relativiser l'objet du click

ensuite en prenant nextAll('span') pour recupérer la collection des spans suivant

https://jsfiddle.net/9p3qk2zy/7/

Sinon si ton code est figé tu peux aussi passer par siblings() de ton image vu qu'il n'y a que les deux spans avec l'image dans le parent


Ou encore en passant par le parent de l'image

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

  var a = $( this ).parent().text()

car à priori tu n'as pas d'autre texte dans l'exemple que celui des spans.

Cela va dépendre de si ton exemple est bien représentatif du DOM final...

[momjunior]

Ok ça marche. Et effectivement je n'ai qu'une image et 2 spans.

Maintenant je voudrais récupérer le 1er et le 2e span séparément, j'ai donc essayé ceci:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
var a = $( this ).parent().text();
    var a1= a[0];
    var a2= a[1];
    console.log("le prix est: "+a1+"la description est: "+a2);

a1 et a2 ne s'affichent pas. Sinon je pensais que la variable "a" sortirait sous forme de tableau.

Merci

[SpaceFrog]

https://jsfiddle.net/9p3qk2zy/9/

[NoSmoking]

Bonjour,
n'oublions pas
Quelle différence y a-t-il entre $(...)[0] et $(...).eq(0) ?

[SpaceFrog]

Certes mais en l'occurence text() ne donne pas une collection.