jQuery.clone（）失去附加的事件处理程序

Question

如果我在应用了事件后使用.clone()克隆了一段文档，那么如何获得这些事件的所有都会返回克隆的元素将克隆的元素重新注入文档？

<div class="row"> 
    <div class="col-lg-3">Something <span class="glyphicon glyphicon-remove-circle text-danger pull-right"></div> 
    <div class="col-lg-3">Something else <span class="glyphicon glyphicon-remove-circle text-danger pull-right"></div> 
</div> 

<script type="text/javascript"> 
    $('.row').delegate('.glyphicon-remove-circle', 'click', function() { 
     $(this).parent().remove(); 
    }); 

    $reset = $('.row').clone(); 
</script> 

<button onclick="$('.row').replaceWith($reset)">Reset</button> 

这里是它的一个fiddle：

我所有的附加事件处理程序，当我做到这一点都将丢失。

Answer 1

如果你还是要用委派事件，只需将它连接到一个不改变祖先和停止担心元素特有的处理程序：

的jsfiddle：http://jsfiddle.net/1o8jk4pf/2/

$('.container').delegate('.row .glyphicon-remove-circle', 'click', function() { 
    $(this).parent().remove(); 
}); 

$reset = $('.row').clone(); 

如果您正在使用最新版本的jQuery，请使用on代替：例如：

$('.container').on('click', '.row .glyphicon-remove-circle', function() { 
    $(this).parent().remove(); 
}); 

委托事件处理程序通过在事件冒泡到单个不变祖先后应用选择器来工作。因此，只有一点事件附件，并且无需担心动态添加的元素。