jQuery copier le contenu d'un div dans un autre

De travail sur mon portfolio script je suis maintenant au point où je veux copier l'invisible <p>-le contenu d'un div dans un autre, mais elle ne fonctionne pas - toute idée comment résoudre ce problème? Essayé le 

.clone()

action, mais cela n'a pas fonctionné jusqu'à présent.

Ont un look À MON VIOLON

Je veux copier à l'intérieur de l'déclenchée .projecttile div dans le #moreinfo div.

InformationsquelleAutor MarcL | 2014-03-19
  1. 1

    Je pense que vous voulez un div distinctes au sein de votre #moreinfo bloc, ou sinon lorsque vous copiez les détails cachés vous effacez votre [X] bouton fermer. Je ne suis pas sûr de savoir si vous êtes en essayant de garder le mannequin d'origine de l'image ou de la copier avec les cliqué sur une, mais vous pouvez copier le texte caché quelque chose comme ça (je suis en utilisant html au lieu de text dans le cas où vous avez balisage là).

    $('#details').html($(this).parent().find('p').html());

    J'aurais aussi peut-être ajouter une classe à l'caché <p> valeurs de référence et par qui, dans le cas où vous voulais plus d'un <p> balise là.

    JSFiddle: http://jsfiddle.net/dshell/8FYrs/

    • Merci pour la réponse, j'ai trouvé une solution à ceci: $(this).nextAll().slice(0, 2).appendTo( "#moreinfo" ); Maintenant, le problème que j'ai: quand j'ai fermé la .moreinfo div ajouté le contenu y reste - que dois-je ajouter à mon clôture de l'action de supprimer le contenu? // Mise a jour de mon jsfiddle
    • Eh bien, c'est pourquoi j'ai suggéré l'ajout d'un nouvel élément à retenir votre contenu de manière explicite. Avec mon violon, vous pourriez faire $('#details').empty() et elle serait supprimée. Avec la vôtre, vous pouvez ajouter une classe à l'objet que vous êtes en ajoutant avec $(this).nextAll().slice(0,2).addClass("appended").appendTo("#moreinfo");, et puis faire quelque chose comme $(".appended").remove();
    • Ouais, super! Fait ce que vous m'avez dit et il fonctionne très bien - merci! Puis-je poser deux questions: 1) Pourquoi ne suis-je pas en mesure de trouver à la fois, le h1 et l'élément p? Et 2) Est-il un moyen de garder leur style que h1 et p lors d'un déplacement dans les détails div?
    • Si vous êtes désireux de déplacer le img balise ensuite, vous pouvez copier l'ensemble du div.portfoliotile avec le html(...) appel - cela permettra de préserver la h1 et p balises où .text(...) ne sera pas. Si vous ne souhaitez pas copier l'image, puis je groupe les p et h1 les marques sous un nouveau div et copie à la place.
    • Boom! Nous y voilà - merci homme! Maintenant, tout ce que je dois faire c'est lisse, de sorte que c'est en fondu. Ce que je viens de remarquer: est-il une façon intelligente pour supprimer le .assombrir classe à partir d'une .projecttile quand un autre .projecttile est active?
    • Heureux de vous aider! J'aurais probablement tout d'abord le supprimer de tout le monde avec un $('.darken').removeClass("darken"); puis ajouter explicitement à celui que vous souhaitez avoir.
    • Qu'entendez-vous par "retirer de tout le monde" ?
    • Le $('.darken') sélecteur trouverez tous les objets de cette classe qui leur est appliqué, et leur retirer de tous. Il n'est donc pas réellement tout le monde, mais tout le monde avec cette classe. Vous pouvez éventuellement sélectionner uniquement projecttiles avec la classe en combinant les classes dans le sélecteur $('.projecttile.darken')
    • Toujours pas sûr si vous voulez dire comme cela, mais ces lignes a résolu le problème: $('.dark').removeClass('noir'); $(this).parent().addClass('noir');
    • Oui, c'est exactement ce que je disais. Je n'ai pas revenir en arrière et regarder à la lettre nom de la classe - vous appelé ça ".darken" ci-dessus, de sorte que c'est ce que j'ai utilisé dans ma réponse. 🙂
    • ouais, était une faute de frappe. Je vous remercie très, très bien! Allons jeter un oeil à la façon de rendre le tout plus "lisse" maintenant et puis je suis prêt à travailler avec elle. Que recommanderiez-vous pour descendre dans le conteneur div contenant le projecttiles lorsque le moreinfo-div est active? J'ai pensé d'abord le calcul de la hauteur de l' .moreinfo-div, ajouter un 0px div avant que le conteneur et augmenter la hauteur de l' .moreinfo de la hauteur.

    InformationsquelleAutor Danny
  2. 2

    Vous pouvez utiliser les balises html() la méthode pour copier du contenu à l'intérieur de l'élément html & définir.

    par exemple

    var data = $('source_div').html();
$('target_div').html(data);
    InformationsquelleAutor demonofthemist