jQuery - 在事件上创建新函数

Question

在JavaScript / jQuery中，如果我想拥有一个可以在附加到DOM的元素上运行的函数，则必须在元素附加到DOM之后创建 。我怎样才能做到这一点？我听说有人可以用jQuery .on()函数做到这一点，但我不太清楚如何。

HTML：

<span>Hello Stackoverflow</span>​

JavaScript的：

$("span").click(function () {
   addMyElement();
});

$("p").click(function () {
   removeMyElement(this);
});

function addMyElement() {
    $("<p>Hello World</p>").appendTo("body");
}
function removeMyElement(myElement) {
    $(myElement).remove();
}

jsFiddle.net上的示例。

Answer 1

这称为delegated-events approach，其工作原理如下：

$("body").on("click", "p", function () {
    // ...
});

您可以使用body的任何父元素代替p。

DEMO： http://jsfiddle.net/wWXrK/6/

Answer 2

function addMyElement() {
    $("<p>Hello World</p>").appendTo("body").click(function () {
       removeMyElement(this);
    });
}

对你有用，但对所有那些链接都没有很大的可读性。