1

有人可以向我解释为什么，当我使用 jquery 克隆一个元素时.clone()，将其存储$(windows).data('myclone')并将此克隆的数据元素附加到另一个元素中，克隆的数据$(windows).data('myclone')会发生变化吗？（指向我在 html 检查器中新创建的元素）

<li class="clone">
    <button class="file-list-delete"><a href="#">clone this</a>
    </button>
    <input type="file" size="30" id="files" multiple="multiple" name="files" class="upload-files">
</li>
<button id="append">append clone</button>

<script>
    $('.clone button').on('click', function() {
        var cloneNode = $(this).parent().clone();
        $(window).data('cloneNode', cloneNode);
        console.log(cloneNode);
    });
    $('#append').on('click', function() {
        console.log($(window).data('cloneNode'));
        var clone = $(window).data('cloneNode');
        $('.clone').after(clone);
    });
</script>

这是在您的控制台中查看它的小提琴。第一个创建的元素只是克隆数据，然后当你附加它时，它会改变它 http://jsfiddle.net/50eu0bnp/

4

3 回答 3

0

好吧，对我来说，第一步是删除 ID 属性以支持类属性。来自jQuery.com：

“注意：使用 .clone() 具有产生具有重复 id 属性的元素的副作用，这些属性应该是唯一的。如果可能，建议避免使用此属性克隆元素或使用类属性作为标识符。”

使用时会发生什么.clone(true)？这是一个“深拷贝”。

于 2014-09-26T14:22:33.857 回答
0

您需要克隆克隆，否则您将重用相同的元素。

您还需要仅定位其中一个元素，或者在每个现有元素之后复制它，class="clone"这会导致创建额外的副本。

JSFiddle：http: //jsfiddle.net/TrueBlueAussie/50eu0bnp/1/

$('.clone button').on('click',function(){
   var cloneNode = $(this).parent().clone();
    $(window).data('cloneNode',cloneNode);
});
$('#append').on('click',function(){
    var clone = $(window).data('cloneNode').clone();  // Clone the clone
    $('.clone:last').after(clone);
});

如果您克隆的元素可以变化（它们目前没有），您需要转移到委托事件处理程序，因为原始$('.clone button')未连接到新副本：http: //jsfiddle.net/TrueBlueAussie/50eu0bnp/3/

$(document).on('click', '.clone button', function () {
    var cloneNode = $(this).parent().clone();
    $(window).data('cloneNode', cloneNode);
});

您还需要解决复制问题，id="files"因为这是完全禁止的。jQuery 将只能看到第一个（例如 with $('#files')），因为 id 必须是唯一的。

于 2014-09-26T14:36:36.410 回答
0 
$('.clone button').on('click', function() {
    var cloneNode = $(this).parent().clone();
    $(window).data('cloneNode', cloneNode);
    console.log(cloneNode);

当您抓取 $('.clone button') 时，您将抓取文档中的每个克隆按钮。只抓一个。

$('.clonebutton')[0].on(...)
于 2014-09-26T14:49:53.147 回答