Jquery recuperer le data

Amstramgram
Javascript

Alors je dois avoir pas trop compris un truc, j'ai cherché dans certain tuto pour récupérer un bout de code mais ca marche pas des masses.

Le truc que je veux faire c'est récupérer le data de l'image lors du clic sur cette image et réinjecter le chemin recuperé dans une img central.

HTMl

<article class="item typographie">
    <img src="media/thumb.jpg" alt="" data-featured="media/featured.jpg">
    <p class="name">creation x</p>
    <p class="cat">categorie : croquis</p>
</article>

Voila ou j'en suis pour le moment avec le Js
jQuery 

$(".item").click(function(){
    var linkimg = $(".item img").data('featured');
    $("#featured").show().css({'height': '700px'});
    console.log(linkimg);
});

Merci

3 réponses

Tackacoder
Réponse acceptée

Bonjour,
@Taka, je rajoute que la fonction data() de jQuery ne fonctionne qu'à partir de jQuery 1.4.3 je crois.
Sinon, je pense que tu ne récupère pas le data de ton élément cliqué.
Essayes

$(".item").click(function(){
    $elem = $(this); //Element courant (cliqué)
    var linkimg = $elem.find('img').data('featured'); //Cherche la balise img de l'élément courant
    $("#featured").show().css({'height': '700px'});
    console.log(linkimg);
});
Taka

Les attributs "data-*" restent des attributs html classique. Tu peux donc faire :

var linkimg = $(".item img").attr('data-featured');

et ensuite pour réinjecter le data-featured dans le src d'une autre image 

$(ici le selecteur qui va bien).attr('src',linkimg);
Amstramgram
Auteur

Merci