Enveloppe <a> étiquettes autour de <img /> avec href = img src?

Question

Essayer d'envelopper une étiquette autour d'une image, addClass et entrée src de img comme href tag:

$(document).ready(function() { 
$(".new img").each(function() { 
    var src = $(this).attr('src').addClass('image'); 
    var a = $('<a/>').attr('href', src); 
    $(this).wrap(a); 
}); 
}); 

Mon HTML:

<img class="new" src="pic0.png" title="Image_Title"/> 

peut sembler ne pas obtenir ce travail. Toute suggestion serait utile!

Answer 1

Deux choses. Premièrement, vous avez votre sélecteur en arrière - il devrait être img.new. Deuxièmement, attr renvoie une chaîne, pas jQuery, donc vous ne pouvez pas l'enchaîner. Procédez comme suit et cela devrait fonctionner:

$(document).ready(function() { 
    $("img.new").each(function() { 
     var $this = $(this); 
     var src = $this.attr('src'); 
     $this.addClass('image'); 
     var a = $('<a/>').attr('href', src); 
     $this.wrap(a); 
    }); 
}); 

Answer 2

Votre sélection a juste besoin d'un ajustement, ceci:

$(".new img") 

devrait être:

$("img.new") 

La classe new est sur lui-même <img>, le <img> n'est pas un descendant d'un class="new" élément, qui est ce que votre sélecteur actuel recherche. En outre .attr('src') obtient une chaîne, vous devez ajouter la classe avant de l'appeler, dans l'ensemble comme ceci:

$(function() { 
    $("img.new").each(function() { 
    var src = $(this).addClass('image').attr('src'); 
    var a = $('<a/>').attr('href', src); 
    $(this).wrap(a); 
    }); 
}); 

You can test it here, ou un peu plus simple/version plus rapide here:

$(function() { 
    $("img.new").each(function() { 
    var a = $('<a/>').attr('href', this.src); 
    $(this).addClass('image').wrap(a); 
    }); 
});