Определить щелчок по сортируемому элементу, который был добавлен с помощью .append

Question

Определить щелчок по сортируемому элементу, который был добавлен с помощью .append

0

Я создаю 2 сортируемых списка, элементы в этом списке добавлены с помощью append(). Все работает нормально, но мне нужно, чтобы элементы перемещались между списками при нажатии.

Я не понимаю, почему событие on click на li не работает.

Вот коды:

присоединять

$("#availble_contacts").append("<li class='contact_li'>" + contact + "</li>");

Перемещение с помощью кликов

$('.contact_li').on('click', function () {
    console.log("click detected");
});

Что мне не хватает?

большое спасибо

palaѕн 11 нояб. 2013, в 12:17

Источник

Теги:

javascript

jquery

jquery-ui-sortable

5 ответов

0

вам лучше привязать событие click на ul, а не li, и определить точное значение li "целью" "события".

$("#availble_contacts").on("click",function(event){
    var e = event || window.event;
    var target = e.target || e.srcElement;
    console.log("you clicked "+target);
})

qiepei 11 нояб. 2013, в 10:16

0

Попробуйте найти

$('#availble_contacts').find('.contact_li').on('click', function () {
    console.log("click detected");
});

Или даже вы можете использовать метод delegate для click event например

$('#availble_contacts').on('click', '.contact_li', function () {
    console.log("click detected");
});

Запишите, что вы поставили код в dom ready

Gautam3164 11 нояб. 2013, в 10:06

0

$(document).on('click', '.contact_li', function () {
    console.log("click detected");
});

Max 11 нояб. 2013, в 10:01

0

См. Ваш lis в.contact_li - это динамически созданный элемент, поэтому непосредственное связывание js-события не будет привязано к нему, поэтому вы можете делегировать событие ближайшему статическому родительскому "#availble_contacts" например "#availble_contacts" в вашем случае:

Измените это:

$('.contact_li').on('click', function () {

к этому:

$("#availble_contacts").on('click', '.contact_li', function () {

Jai 11 нояб. 2013, в 08:44

Ещё вопросы

palaѕн · Accepted Answer · 2013-11-11T09-02-00.000Z

Поскольку contact_li добавляется динамически, вам необходимо использовать event delegation для регистрации обработчика событий

// New way (jQuery 1.7+) - .on(events, selector, handler)
$('#availble_contacts').on('click', '.contact_li', function() {
    console.log("click detected");
});