Potrzebujesz pomocy jquery, aby skopiować DIV do innego DIV i mieć nadzieję, że jest to możliwe. Mam następujące HTML:jQuery duplikat DIV do innego DIV
<div class="container">
<div class="button"></div>
</div>
A potem mam innego DIV w innym miejscu w moją stronę i chciałbym, aby skopiować „przycisk” div w poniższym „pakietu” Gr:
<div class="package">
Place 'button' div in here
</div>
będziemy chcieli użyć metody clone() aby uzyskać głęboką kopię elementu:
$(function(){
var $button = $('.button').clone();
$('.package').html($button);
});
Pełna demo: http://jsfiddle.net/3rXjx/
Z jQuery docs:
.clone() metoda wykonuje głęboki kopię zestawu dopasowanych elementów, co oznacza, że kopiuje dopasowane elementy jak wszystkie ich elementów tekstowych i węzłów potomnych . W przypadku użycia w połączeniu z z jedną z metod wstawiania, .clone() jest wygodnym sposobem na powielenie elementów na stronie na .
$(".package").html($(".container").html());
Włóż to zdarzenie
$(function(){
$('.package').click(function(){
var content = $('.container').html();
$(this).html(content);
});
});
Można kopiować div jak to
$(".package").html($(".button").html())
kodu kopiować z użyciem klonu i funkcji appendTo:
Oto także przykład pracy jsfiddle
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
</head>
<body>
<div id="copy"><a href="http://brightwaay.com">Here</a> </div>
<br/>
<div id="copied"></div>
<script type="text/javascript">
$(function(){
$('#copy').clone().appendTo('#copied');
});
</script>
</body>
</html>
To nie zachowuje wartości dodanych przez użytkownika na wejściach. –
czy możesz mi powiedzieć, dlaczego potrzebujemy '$' in 'var $ button'. Wierzę w js, możesz zadeklarować var po prostu jako 'var button'. – KNU
@KNU Nie jest to konieczne, ale jest to powszechna konwencja w świecie jQuery. Wskazuje, że zmienna przycisku $ jest obiektem jQuery. Zobacz http://stackoverflow.com/questions/205853/why-would-a-javascript-variable-start-w--dollar-sign – chrx