Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   jquery .clone() трабла (https://javascript.ru/forum/jquery/21700-jquery-clone-trabla.html)

bookin 20.09.2011 18:44

jquery .clone() трабла
 
имею вид

<div id='block'>
	<div class='row'></div>
	<div class='row'></div>
	<div class='row'></div>
</div>


var div=$('#block .row').last().clone();
$(document).click(function(){
	$('#block').append(div);
})


просто хочу вставлять в див несколько копий элемента, но при вставке первый раз появляется копия, а последующие разы, последняя вставленная копия удаляется и появляется новая.

Как можно избежать этого удаления ? Заранее благодарю

Serg_pnz 20.09.2011 20:43

$(document).click(function(){
  $('#block').append($('#block .row').last().clone());
})

Пример http://javascript.info/play/6EBguc

bookin 21.09.2011 08:59

проблема в том что клон должен записаться только при загрузке страницы а выполнится уже на событии

$(function() {
var clone = $('#block .row').last().clone();
$(document).click(function(){
  $('#block').append(clone);
})


})


вот в таком виде уже не работает((
может посоветуете каким образом можно по другому сделать

Serg_pnz 21.09.2011 12:36

Тогда я не понимаю что Вы хотите изобразить...

bookin 21.09.2011 12:49

на странице имеються дивы

<div class='row'></div>


внутри которых заменяется контен, мне нужно при входе на страницу сохранить копию одного дива что в поледствии, после изминения во всех таких дивах контента можно было вернуть изночальный вариант

Beriagts 21.09.2011 12:51

Записать вы имеете виду эту строчку
var clone = $('#block .row').last().clone();
?
потом вам нужно его вставить в событие?
это Вы привели кусок "вырваного" кода возможно,
возможно у вас ошибка в объявлении вара, может он не доступен для вашего события

bookin 21.09.2011 13:48

даже здесь пробую, в минимализме, оно дает тот же эффект, вставляется один раз, после про100 удаляет последнюю вставленую и вставляет по новой.

тут та он доступен для события, вроде верно обьявляю

Serg_pnz 21.09.2011 14:03

----

Serg_pnz 21.09.2011 14:17

$(function() {

var el = $('#block .row').last().clone()

$(document).click(function(){
  $('#block').append(el.clone());
})

})

По моему оно http://javascript.info/play/FjIapc

bookin 21.09.2011 15:57

Serg_pnz спасибо, что то недапер до этого)

может кт подскажет почему дает такой эфект?

Serg_pnz 21.09.2011 21:43

Я всего лишь пользователь, как ядро работает - хз. Но получается, что создан объект, - один экземпляр, - и он сам на себя вставляется (смотрел поведение в firebug по "втыканию" элементов в страницу). А клонируя созданный, как бы в буфер объект, мы получаем искомое.
Поправьте, плз, кто шарит в движках.

PeaceCoder 27.09.2011 13:06

Цитата:

Сообщение от Serg_pnz
Поправьте, плз, кто шарит в движках.

именно так. jq везде так тупит.

nikita.mmf 29.09.2011 14:13

PeaceCoder,
причем тут jQuery? так устоен DOM.
<!DOCTYPE HTML>
<html lang="en-US">
<head>
	<meta charset="UTF-8">
	<title></title>
</head>
<body>
	<button>clone text(incorrect)</button>
	<button>clone text(correct)</button>
	<button>remove clones</button>
	<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam in tellus eget tellus dignissim facilisis. Integer ligula arcu orci aliquam.</p>
	<script type="text/javascript">
		var p = document.getElementsByTagName('p')[0], 
			buttons = document.getElementsByTagName('button'),
			button1 = buttons[0],
			button2 = buttons[1],
			button3 = buttons[2];
		var cloneP = p.cloneNode(true);// клон
		button1.onclick = function () {
			cloneP.style.border = "solid 1px red";
			document.body.appendChild( cloneP );// вставляем в body один и тот же элемент
		};
		button2.onclick = function () {
			var cloneOfCloneP = cloneP.cloneNode(true);
			cloneOfCloneP.style.border = "solid 1px yellow";
			document.body.appendChild( cloneOfCloneP );// вставляем в body клон клона, таким образом каждый раз создаем новый элемент
		};
		button3.onclick = function () {
			var allP = document.getElementsByTagName('p');
			while ( 1 in allP ) {
				document.body.removeChild(allP[1])
			}
		};
	</script>
</body>
</html>


Часовой пояс GMT +3, время: 21:44.