.on Нажмите для динамически созданного элемента

Question

Я добавляю <li>, и когда я пытаюсь щелкнуть по нему с помощью нового события .on, он не работает. Я не хочу использовать событие .live, поскольку в будущем оно может быть устаревшим.

Вот мой пример: http://jsfiddle.net/2Lbbe/

Это работает для первого элемента, если вы создаете новый, оповещение не работает.

Кто-нибудь знает, как можно решить эту проблему, не используя live?

Answer 1

Вы достаточно близко, все, что вам нужно сделать, это изменить настройку селектора:

С

$("#bxs li").on('click',function() {

На

$("#bxs").on('click', 'li',function() {

Вот обновлениеваш jsfiddle: http://jsfiddle.net/jasper/2Lbbe/2/

Использование функции .on() аналогично старой функции .delegate():

$(elements).delegate(selector, events, data, handler);  // jQuery 1.4.3+
$(elements).on(events, selector, data, handler);        // jQuery 1.7+

Answer 2

Вы по сути пытаетесь сделать то, что раньше называлось .delegate (). Прикрепите обработчик событий к чему-то постоянному, а затем загляните внутрь своих целей.

$("#bxs").on('click', 'li',function() {

ваша обновленная скрипка

Из документов :

.on (события [, селектор] [, данные], обработчик)

Описание: Присоединить функцию обработчика событий для одного или нескольких событий к выбранным элементам.

.on () теперь может служить целям .bind () .live () и .delegate () в зависимости от того, как он используется. Если вы хотите, чтобы обработчик применял к будущим элементам, вы должны сделать окончательный выбор, используя опциональный [,selector]