附加 DOM 对象时触发 JQuery 单击事件

Question

所需功能:我有一个 JQuery 函数，可以将新元素附加到页面。这些新元素可以被单击来再次调用创建者函数，但不应在创建后立即调用单击函数。

问题:当函数被触发时，新元素会被附加，并且 on("click") 函数会被递归且无限地触发。

HTML:

<input type="button" value="test"/>
<div id="divContainer">

JQuery:

$('input[type=button]').click( function() {
    createDiv();
});

function createDiv(){
    $("<div id='innerDiv'>Div element</div>").appendTo("#divContainer").on("click", createDiv());
}

JsFiddle: http://jsfiddle.net/uWXbA/

观察:这不是真正的代码，它是问题本身的摘录。

Answer 1

这部分:

.on("click", createDiv())

正在调用createDiv()函数。您想要传递对该函数的引用，如下所示:

.on("click", createDiv)

或者，正如上面所说，包装在匿名函数中也可以:

.click(function() {
    createDiv();
});

http://jsfiddle.net/QayWP/