0

jQueryUIとクローン要素で奇妙な問題が発生しています。jQuery UIイベントは正しくコピーされているように見えますが、イベントはクローンされたものではなく、元のDOMオブジェクトを参照しているようです。

このJSフィドルは問題を示しています：http：//jsfiddle.net/XDrC5/

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());
  });
});

[クローン]をクリックすると、下のボックスのオレンジ色の正方形が適切に複製されますが、新しい正方形をドラッグしようとすると、元の正方形が移動します。新しい正方形のサイズを変更しようとしても、何も起こりません。

これにより、複製された要素でjQueryUIメソッドを呼び出そうとすると大きな問題が発生します。たとえば.draggable("destroy");、クローンの後に呼び出すと、実際には元の要素からドラッグ可能要素が削除され、新しい要素と古い要素の両方が移動できなくなります。

これを回避する方法があるのか​​、単に密度が高いのか、それともこれが避けられないバグなのかはわかりません。どんな助けでも大歓迎です。

4

1 に答える 1

1

Beetroot-Beetrootに対応して、問題はclone(true)、前に添付されたイベントをコピーしていることである可能性がありますelem。つまり、新しいelemは、#sourcediv内でサイズを変更するように指示され、サイズ変更せずに試してtrueから、サイズ変更可能なイベントを#copydiv内のelem 。

JSFiddleを更新しました-http ://jsfiddle.net/XDrC5/2/これにより、ドラッグ可能な問題が修正されたようです。

于 2013-02-25T10:56:27.447 に答える