Javascript、jQuery - 如何对刚刚创建的对象签名操作？

Question

我正在尝试制作能够添加和删除元素的简单列表。现在，我正在努力添加每个列表元素对象(现有的和添加的)并对其执行简单的操作。不幸的是我在这方面遇到了一些困难。我可以修改一开始创建的对象，但不能修改“网页工作”期间添加的对象。

首先我的想法是添加 AJAX，但我认为这不是最简单的方法。

我想不久前(我不记得在哪里)我读过如何使这项工作有效，但现在我不知道。如果有人能帮助我解决这个问题，或者至少提供一个对此进行良好解释的链接，我将非常高兴。

这是我到目前为止所做的(好吧，这主要只是一个划痕，但主要思想就在其中):http://jsfiddle.net/sebap123/pAZ7H/0

$("li").click(function() {
    $(this).text("new text");
});
$("#addButton").click(function() {
    $(".list").append(
    $('<li>').append($('<span>').append("added li")));
});​

感谢您的所有回复。

Answer 1

您只需要通过 on() 方法使用事件委托(delegate):

$("ul").on('click','li', function() {
    $(this).text("OK");
});

JS Fiddle demo .

您遇到的问题是 jQuery 只能直接将事件绑定(bind)到已经存在的元素(在事件绑定(bind)时存在)； on() 方法将操作绑定(bind)到添加新内容的元素(或新添加元素的祖先元素)，标识要监听 'click' 的事件(以空格分隔的事件列表)，与选择器 (li) 匹配，然后该函数执行所需的操作。

如果您使用的是 jQuery 1.7(或更高版本)，应使用 on()，对于 jQuery < 1.7 的版本，应使用 delegate() (它或多或少做了相同的事情，但颠倒了事件列表和选择器参数):

$("ul").delegate('li', 'click', function() {
    $(this).text("OK");
});

JS Fiddle demo .

引用文献:

• delegate() .
• on() .