à l'aide replaceWith sur toutes les entrées enfant JQuery

Question

En gros sur .show() J'ai essayé d'avoir toutes les entrées se convertir à des balises d'image avec le src img égale à la valeur des entrées d'origine comme ceci:

var currentPage = $('.three_paj_els:visible'); 
var nextPage = currentPage.next('.three_paj_els'); 
var the_parent_div_id = currentPage.attr('id'); 
    nextPage.show(function() { 
     $('div#' + the_parent_div_id + ':input').each(function() { 
      var the_image_SRC = $(this).val(); 
      $(this).replaceWith('<img src="' + the_image_SRC + '" ') 
     }) 
    }) 

Été là pour quelques heures maintenant. Je veux seulement ceux de cette div spécifique qui se convertit.

est ici un violon de ce que je travaille sur http://jsfiddle.net/Utr6v/100/ lorsque vous cliquez sur le bouton suivant, les balises <input type="hidden" /> doivent convertir en <img> balises et les images devraient montrer.

Merci beaucoup à l'avance. -Sal

Answer 1

currentPage ne semble pas avoir d'ID. Mais vous êtes trop compliqué - si vous avez l'élément, vous pouvez l'utiliser pour exécuter des fonctions jQuery. Vous n'avez pas besoin de faire un élément -> ID -> conversion d'élément puisque c'est inutile.

Pour trouver des descendants, vous devez placer un espace entre le sélecteur d'élément et le sélecteur descendant, sinon le sélecteur s'applique aux éléments eux-mêmes. Dans votre cas, vous pouvez simplement utiliser .find.

De plus, il vous manquait la balise de fermeture de l'image.

http://jsfiddle.net/Utr6v/101/

// I guess you want to replace with images on the new page, not the one 
// which gets hidden 

nextPage.find(':input').each(function() { 
    var the_image_SRC = $(this).val(); 
    $(this).replaceWith('<img src="' + the_image_SRC + '">') 
});