jQuery clone() not cloning event bindings, даже с on()

Question

Я создал серию пользовательских событий jQuery для использования в мобильных веб-приложениях. Они отлично работают и прошли тестирование. Тем не менее, у меня возникла небольшая проблема, с которой у меня возникли проблемы с пониманием.

Я использую .clone() на нескольких элементах внутри DOM, которые содержат кнопку. Кнопка имеет некоторые связанные с ней пользовательские события (события привязаны с использованием .on()), но. К сожалению, когда я использую jQuery's .clone(), привязки не сохраняются, и я должен добавить их снова.

Кто-нибудь сталкивался с этим раньше, знает ли кто-нибудь о потенциальной работе? Я думал, что использование .on() должно было сохранить привязку к элементам, которые существуют сейчас или в будущем?

Answer 1

Я думаю, вы должны использовать эту перегрузку метода .clone():

$element.clone(true, true); 

клон ([withDataAndEvents] [, deepWithDataAndEvents])

withDataAndEvents: логическое значение, указывающее ли событие обработчики и данные должны быть скопированы вместе с элементами. Значение по умолчанию неверно.

deepWithDataAndEvents: Булев, указывающий, должны ли копироваться обработчики событий и данные для всех детей клонированного элемента. По умолчанию его значение соответствует значению первого аргумента (по умолчанию это значение false).

---

Помните, что .on() фактически не связывают события с целями, но к элементу вы делегируя. Так что если у вас есть:

$('#container').on('click', '.button', ...); 

События на самом деле переплетены в #container. Когда происходит щелчок по элементу .button, он пузырится до элемента #container. Элемент, который инициировал событие, оценивается по параметру селектора .on(), и если он соответствует, выполняется обработчик события. Вот как работает делегирование событий.

Если вы клонируете элемент #container, вы должны глубоко клонировать события и данные для привязок, сделанных с .on(), которые необходимо сохранить.

Это не было необходимо, если вы использовали .on() у родителя #container.

Answer 2

Вы должны знать, что функциональность глубокого клонирования была добавлена ​​к версии 1.5 jQuery.

Более подробная информация по этой теме:

http://api.jquery.com/clone/