jQuery clone () nie klonuje powiązań zdarzeń, nawet z on ()

Stworzyłem serię niestandardowych zdarzeń jQuery do wykorzystania w mobilnych aplikacjach internetowych. Działają świetnie i zostały przetestowane. Jednak napotkałem mały problem, którego nie rozumiem.

Używam .clone()kilku elementów w DOM, które zawierają przycisk. Z przyciskiem są powiązane niektóre zdarzenia niestandardowe (zdarzenia są powiązane za pomocą .on()), ale. Niestety, kiedy używam jQuery .clone(), wiązania nie są zachowywane i muszę je dodać ponownie.

Czy ktoś spotkał się z tym wcześniej, czy ktoś wie o potencjalnym obejściu? Myślałem, że używanie .on()ma na celu zachowanie wiązania elementów, które istnieją teraz lub w przyszłości?

Myślę, że powinieneś użyć tego przeciążenia metody .clone () :

$element.clone(true, true);

clone ([withDataAndEvents] [, deepWithDataAndEvents])

withDataAndEvents : wartość logiczna wskazująca, czy procedury obsługi zdarzeń i dane powinny być kopiowane wraz z elementami. Wartość domyślna to false.

deepWithDataAndEvents : wartość logiczna wskazująca, czy programy obsługi zdarzeń i dane dla wszystkich elementów podrzędnych sklonowanego elementu powinny zostać skopiowane. Domyślnie jego wartość jest zgodna z wartością pierwszego argumentu (domyślnie false).

Uważaj, .on()ponieważ w rzeczywistości nie wiąże zdarzeń z celami, ale z elementem, do którego delegujesz. Więc jeśli masz:

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

Zdarzenia są w rzeczywistości powiązane #container. Kliknięcie .buttonelementu powoduje przejście do #containerelementu. Element, który wyzwolił zdarzenie, jest oceniany na podstawie parametru selektora .on()i jeśli pasuje, wykonywana jest procedura obsługi zdarzenia. Tak działa delegowanie zdarzeń.

Jeśli sklonujesz element #container, musisz sklonować głęboko zdarzenia i dane, .on()aby zachować powiązania utworzone za pomocą .

Nie byłoby to konieczne, gdybyś używał .on()na rodzicu domeny #container.

Należy mieć świadomość, że do wersji 1.5 jQuery dodano funkcję głębokiego klonowania.

Więcej informacji na ten temat:

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