如何使用JQuery克隆没有事件的数据元素

Question

我希望使用它的数据属性克隆<select>标记，但不包含其事件。

关注JQuery Official .clone() api，我知道我可以通过调用克隆没有数据和事件 $('#grolsh').clone()，或执行

$('#grolsh').clone(true)将复制数据和事件。

我想保留数据，但要清除与原始项目关联的事件。

Answer 1

从版本1.7开始，off()是解除绑定的首选方法：

$('#grolsh').clone(true).off();

Answer 2

只需使用

$('#grolsh').clone(); // 复制元素结构

$('#grolsh').clone(true) // 将数据和事件与结构一起复制

$('#grolsh').clone(true).off() // 复制数据和事件并删除处理程序

与.on()绑定并使用.off();

删除的事件

与.bind()绑定并使用.unbind();

删除的事件

Answer 3

添加 .off() ：

$('#grolsh').clone(true)
    .attr({'id': 'newGrolsh'})
    .off()
    .appendTo('#target');

<强>更新 正如Adrian建议 .off 对 .unbind

更好的解决方案

Answer 4

从jQuery 1.5开始，你可以传递第二个参数（参见：.clone( [withDataAndEvents ] [, deepWithDataAndEvents ] )）而不是复制事件处理程序：

$('#grolsh').clone(true,false);

Answer 5

如果您真的只想复制.data()方法附加的数据请勿滥用事件（联合国）绑定，只需执行以下操作：

var $original = $(".originalSelector");
var $clone = $original.clone().data( $original.data() );

因为当您将对象传递给.data()方法时，它会用它扩展当前数据。

！重要提示！
如果要使用存储DOM引用并使用它的东西，则不能这样做，例如 jQuery UI draggable 等...
=＆gt;仅用于“纯”数据/基本类型