Question

我遇到了jQuery UI和克隆元素的奇怪问题。即使jQuery UI事件似乎被正确复制，似乎事件仍然引用原始DOM对象，而不是克隆的对象。

这是HTML：

<button id="clone">Clone</button>

<div id="source">
  <div id="elem"></div>
</div>

<div id="copy">
</div>

和Javascript：

$(document).ready( function() {
    $("#elem").resizable({
        containment:"parent"
    }).draggable({
        containment:"parent"
    });

  $("#clone").on("click", function() {
    var newHTML = $("#source").clone(true);

      $("#copy").html(newHTML.contents());
  });
});

单击克隆正确复制下方框中的橙色方块，但尝试拖动新方块会导致原始方格移动。试图调整新广场的大小什么都没做。

当尝试在克隆元素上调用jQuery UI方法时，这会导致更大的问题。例如，在克隆之后调用.draggable("destroy");实际上从原始元素中删除了draggable，使新旧不可移动。

我不确定是否有解决方法，如果我只是在密集，或者这是一个不可避免的错误。非常感谢任何帮助。

Answer 1

我认为在回应Beetroot-Beetroot时，问题可能是通过执行clone(true)您正在复制附加到上一个elem的事件，这意味着新的elem被告知要在其中调整大小#source div，在没有true的情况下尝试，然后将可调整大小的事件重新附加到#copy div内的元素。

我更新了JSFiddle - http://jsfiddle.net/XDrC5/2/这似乎解决了可拖动的问题。

jQuery UI克隆的可拖动元素不可拖动

1 个答案: