Здравствуйте.
Есть некий скрипт, который должен добавить 3 раза один элемент после последнего tr#char_block_set
.
Но добавляет почему-то только один. Подскажите, пожалуйста, как это поправить?
Stack Overflow на русском — это сайт вопросов и ответов для программистов. Присоединяйтесь! Регистрация займёт не больше минуты.
Присоединиться к сообществуЗдравствуйте.
Есть некий скрипт, который должен добавить 3 раза один элемент после последнего tr#char_block_set
.
Но добавляет почему-то только один. Подскажите, пожалуйста, как это поправить?
Для начала немного исправления ошибок:
detach()
.Теперь до делу:
Суть работы функции clone()
в том, что при создании с помощью неё элемента в DOM этот элемент будет добавляться только 1 раз, и все манипуляции с клоном будут происходить всегда с одним и тем же элементом. То есть добавление клона 3 раза, это всё равно что 3 раза поставить в конец очереди одного человека, человек всё равно останется один. В доказательство утверждения пример на основе данных автора. Клон добавляем 3 раза с разными классами, в итоге получается элемент, имеющий 3 класса, которые он получал по очереди при каждом новом добавлении на страницу.
Поэтому вам нужно делать 3 клона для добавления элемента несколько раз, но при этом вам нужно добавлять клоны в конец таблицы, убирая исходный элемент. Могу вам предложить такой вариант:
Исходную строку всё-таки называем классом, а не id. Для последней строки таблицы определяем class="last"
. Пишем функцию для клонирования элемента, при этом клонируем исходного клона char_b_tr
каждый раз заново, если бы вам не нужно было убирать первоначальный элемент, то можно было бы клонировать сам элемент:
function pasteClone() {
var stroke = char_b_tr.clone().addClass("fsdfsdf" + i);
$('.last').before(stroke);
i++;
}
С помощью detach()
убираем исходный элемент. А далее вызываем функцию клонирования 3 раза.
Вот итоговый пример.
Для мультиклонирования, можете добавить такое расширение jQuery
$.fn.duplicate = function(count, cloneEvents) {
var tmp = [];
for ( var i = 0; i < count; i++ ) {
$.merge( tmp, this.clone( cloneEvents ).get() );
}
return this.pushStack( tmp );
};
Пример использования:
$('.char_block_set').duplicate(3).insertAfter('.char_block_set:last');