jQuery.clone() 使用 withDataAndEvents 似乎没有复制数据

Question

好的，我已经考虑了一段时间但没有成功。根据 jQuery 文档，如果我在具有数据的对象上使用 .clone(true)，那么当我将 withDataAndEvents 参数设置为 true 时，该数据也会被复制。

例如，我有一个对象。我克隆它。我使用 $(obj).data('mydata')['title'] = "My New Title"; 更新克隆上的数据。然后，当我检查原始对象中 mydata 上的 title 元素时，它现在也具有 "My New Title".

的值

为什么这对我不起作用？我缺少什么？还是这不是它应该的工作方式？

我有一个 fiddle 实现了我正在尝试实现的概念，它做同样的事情。

http://jsfiddle.net/JAZ013/5ryyu0Lq/2/

谢谢！

Answer 1

如果您查看 withDataAndEvents 的文档，它会复制数据而不是克隆数据。

A Boolean indicating whether event handlers and data should be copied along with the elements.

在您的情况下，两个元素 mydata 都引用同一个对象，因此对该对象属性所做的任何更改都将反映在两个元素中

Answer 2

我遇到了同样的情况，通过扩展 div1 数据并分配给 div2 数据解决了这个问题。

这里的情况有点不同，因为值是 {title:'My DIV #1'}，所以对象 title 被引用而不是被复制。我通过扩展 div1 data 解决了这个问题。

看下面的例子：

$(document).ready(function(){
    var myDIV1 = $('#test1');
    myDIV1.data('mydata', {title:'My DIV #1'});
    
    var myDIV2 = myDIV1.clone();
    myDIV2.data('mydata',$.extend({}, myDIV1.data('mydata')));
    myDIV2.data('mydata')['title'] = 'My DIV #2';

    myDIV1.after(myDIV2);

    myDIV1.html(myDIV1.data('mydata')['title']);
    myDIV2.html(myDIV2.data('mydata')['title']);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    
<div id="test1">Thank you for trying this for me!</div>

http://jsfiddle.net/kishoresahas/5ryyu0Lq/3/

jQuery.clone() 使用 withDataAndEvents 似乎没有复制数据

jQuery.clone() using withDataAndEvents does not seem to copy data

javascript

jquery

jsfiddle