Как я могу обработать событие щелчка динамически заполненного ul?

Question

Я работаю с системой авторизации. У меня четыре неупорядоченных списка. Назовем их list1, list2, list3 и list4. два из них о странах и остальные два - о городах. list1 содержит все страны. list2 содержит все доступные страны для одного сотрудника. Пользователи перемещают одну страну из списка1 в список2. когда пользователь нажимает list2, я могу обработать это событие, и я населяю город этой страны, чтобы list3 с jquery. Этот список городов происходит с веб-страницы aspx. Я хочу обработать событие click4 списка. list4 содержит все доступные города для сотрудников. Я написал эти строки.

$('#clist2 li').click(function() { 
    alert('test'); 
}); 

Но я не видел предупреждения. Как я могу обработать событие click4 списка?

Answer 1

Вы можете использовать .delegate() здесь, как это:

$('#clist2').delegate('li', 'click', function() { 
    alert('test'); 
}); 

$('#clist2 li') получает все <li> элементы внутри #clist2в то время, вместо этого вы можете связать обработчик #clist2 непосредственно который прослушивает для click событий из любые <li> элементы (присутствующие или добавленные позже, их события пузырь так же) до bubble up.

Answer 2

Вы можете использовать .live(), чтобы все события li получили события щелчка независимо от того, существуют ли они во время привязки или нет (например, селектор просто должен совпадать).