找出使用 jquery 单击的列表元素(列表是动态添加的)

Question

Case1：html中已经存在列表

<ul id="list1">
    <li>One</li>
    <li>Two</li>
</ul>

单击的 li 元素使用

$('#list1 li').bind('click', function(){
   alert($(this).html());
});

以上工作正常。

案例2：

现在，如果列表是动态添加

的

<div id="testDiv">
</div>
var output = '<ul id="list1">' +
             '<li>One</li>' + 
             '<li>Two</li>' +
             '</ul>';
$('#testDiv').html(output);

我尝试使用相同的代码检测单击的 li 元素

$('#list1 li').bind('click', function(){
    alert($(this).html());
});

在这种情况下，它不会检测到

Answer 1

在这种情况下，使用事件委托

$('#testDiv').on('click', '#list1 li', function () {
    alert($(this).html());
});