0

我正在尝试动态添加一个按钮 - 第一个按钮有效,但其他按钮无效。我以前使用过该live功能,但 jQuery 1.9.1 删除了该功能。我应该怎么做才能使新添加的按钮起作用?

HTML 代码:

<div class="take">
    <p>this is the para</p>
    <button class="test">copy</button>
</div>

jQuery代码:

$('.test').on('click', function() {
    var a = $(this).parent();
    new.clone().insertAfter(a);
})

这是jsfiddle

4

3 回答 3

7

在克隆中传递 true 将解决您的问题 - jsfiddle

$('.test').on('click', function() {
    var o = $(this).parent();
    o.clone(true).insertAfter(o);        
})

注意:new是 JavaScript 中的关键字,因此不要将其用作变量。

于 2013-04-09T14:55:49.320 回答
2
$(document).on('click', '.test', function() {
    var o = $(this).parent();
    o.clone().insertAfter(o);   
});

而不是document使用非动态父 ID 选择器

http://jsfiddle.net/uk6Bh/1/

可视化:

$('#non-dynamic-parent').on('event', '.dynamic-delegated-element', function() {

http://api.jquery.com/on/说:

委托事件的优点是它们可以处理来自以后添加到文档的后代元素的事件。通过选择在附加委托事件处理程序时保证存在的元素,您可以使用委托事件来避免频繁附加和删除事件处理程序的需要。例如,该元素可以是模型-视图-控制器设计中视图的容器元素,或者如果事件处理程序想要监视文档中的所有冒泡事件,则可以是文档。在加载任何其他 HTML 之前,文档元素在文档头部是可用的,因此在此处附加事件是安全的,而无需等待文档准备好。

于 2013-04-09T14:58:18.917 回答
1

您想使用.on()演示):

$(document).on('click', '.test', function() {
    var o = $(this).parent();
    o.clone().insertAfter(o);
})
于 2013-04-09T14:57:06.047 回答