$(".thumbs div").click(function () {
var t = $(this);
t.appendTo(t.parent().prev(".view_full_img"));
});
Come clonare un elemento e aggiungere a un div specifico?
-
29-07-2022 - |
Domanda
Ho una pagina che ha un paio di miniature per immagini che quando vengono cliccate vengono clonate e aggiunte in un altro elemento. Il problema in cui sto correndo è che tutti gli elementi di cui ho bisogno appendTo
Tutti hanno la stessa classe. Quindi, se faccio clic su una miniatura, viene aggiunto a ogni singolo elemento che ha la classe view_full_img
. Ecco l'HTML con cui devo lavorare. Basta prendere di mira questi con classi diverse non funzionerà per me, questo HTML è generato da Drupal.
<div class="view_full_img"></div>
<div class="thumbs">
<div class="img blue"></div>
<div class="img green"></div>
<div class="img yellow"></div>
</div>
<div class="view_full_img"></div>
<div class="thumbs">
<div class="img red"></div>
<div class="img purple"></div>
<div class="img orange"></div>
</div>
Ecco il mio jQuery ..
$(".thumbs div").click(function(){
$(".view_full_img div").remove();
$(this).clone().appendTo(".view_full_img");
});
Quello che voglio accadere è che quando faccio clic su uno dei .thumbs
div voglio che venga clonato nel .view_full_img
Div che è direttamente sopra di esso. Ho provato a usare le combinazioni di closest()
prev()
parent()
ecc. E non riesco proprio a trovare qualcosa che funziona.
Ecco un jsfiddle ...http://jsfiddle.net/dmcgrew/uetv6/
Soluzione 2
Altri suggerimenti
Hai bisogno parent()
, poi prev()
:
$(".thumbs div").click(function () {
$(this).parent().prev(".view_full_img").empty().append($(this).clone());
});