Javascript-форум - Проблема с clone() dom элемента.

Javascript-форум (https://javascript.ru/forum/)

- jQuery (https://javascript.ru/forum/jquery/)

- - Проблема с clone() dom элемента. (https://javascript.ru/forum/jquery/14830-problema-s-clone-dom-ehlementa.html)

Проблема с clone() dom элемента.

Здравствуйте, пытаюсь сделать создание копии элемента и добавление класса элементу с инкрементным id. То есть при нажатии на ссылку (Например Добавить поле), должны создаваться новые поля file . Делаю так, но работает это не корректно :-?

$("#add-file-field").click (function() {
		var i=0;
		$(".file_inp").each(function() {
	 $(".file_inp").clone().appendTo('body').addClass(i++);

			});
	});

Уже и без использования цикла, и с $this, всё безуспешно. Что не так, подскажите пожалуйста. Спасибо

<script src="http://code.jquery.com/jquery-1.5.min.js"></script>
<script>
$(function(){
    var i=0;
    $('a').click(function() {
        $(this).clone(true).appendTo('body').text($(this).text()+i+++' : ');
         return false;
    });
});
</script>

<a href="#">click</a>

monolithed, спасибо большое, вы меня немного опередили , впринципи мы с вами всё одинаково почти сделали, но только нужно добавить этот айдишник в класс .file_Inp , допустим, там уже буду добавлять по дому куда нужно будет(например в ....name = userfile[id].....) в этом tr.file_Inp ..

var i=0;
			   $("#cloneButton").click(function () {
$('.file_Inp:first').clone(true).insertAfter(this).appendTo('#Add_Object_Table');       
		  });

У вас получалось вы клонировали текущий элемент #cloneButton, у меня же , как видите, клонируется весь участок элементов tr.file_Inp , вместе с баттоном #cloneButton. ((( Как сюда впилить это id?

Цитата:

Сообщение от vitja

но работает это не корректно

ничего удивительного, присмотрись - ты пускаешь цикл по всем элементам класса, а внутри работаешь не с тем что перебирается в цикле а со всеми.

$(this).clone()

С инкрементом не совсем понял. В пределах одного добавления классы уникальные?

Цитата:

Сообщение от micscr (Сообщение 90920)

да, да , да, здесь разобрался уже, пасибо

Цитата:

Сообщение от micscr (Сообщение 90920)

С инкрементом не совсем понял. В пределах одного добавления классы уникальные?

Давайте я вам покажу на моём примере, сразу всё поймёте..

<tr class="file_Inp">
				<td>				
				<input type="file" name="userfile[id]">
				<a href="#" id="cloneButton">Добавить</a> 
				</td>
			</tr>

Сейчас у меня tr-ки создаются, по схеме

$("#cloneButton").click(function () {
$('.file_Inp:first').clone(true).insertAfter(this).appendTo('#Add_Object_Table');

При этом необходимо инкрементировать id в input name. Выше я показал в части html кода.
Т.е userfile[1] , userfile[2], userfile[3]. А там уже в php буду обрабатывать массив файлов..

id++;
var $new = $('.file_Inp:first').clone(true).insertAfter(this).appendTo('#Add_Object_Table');
$new.find('input').attr('name', 'userfile[' + id + ']');

id - сделай глобальной и установи вначале значение - по тем что имеются.

Цитата:

Сообщение от micscr

id - сделай глобальной и установи вначале значение - по тем что имеются.

Включил немного логики, поправил, всё заработало. И вот наша с вами фича, как по мне очень даже нужная ).

var id=0;
$('.file_Inp').each( function() {
		
			   $("#cloneButton").click(function () {
				   id++;
				   alert(id);
				   var c  =  $('.file_Inp:first').clone(true).insertAfter(this).appendTo('#Add_Object_Table'); 
				   c.find('input').attr('name', 'userfile['  + id + ']');
		  });
			   
			  
	});