0

ボタンクリックイベントでjavascriptを使用して作成された動的に作成されたdivにdivをドロップしたいここに私のコードがあります

$("#add").click(function() {

   var d = document.createElement("div");

   d.className = "machine";

   document.getElementById("cloud").appendChild(d);

});

これは、作成した div の上にドラッグ アンド ドロップしたい div です。これが私のドラッグ可能なコードです。

$("#Softwares-List div").draggable({

   helper:"clone"

});

<div id="Softwares-List">

      <div id="java">Java</div>

      <div id="ror">Ruby on Rails</div>

      <div id="dotnet">Visual Studio 10</div>

</div>

Javaをドラッグして、動的に作成されたdiv、つまりdiv.machineにドロップするとします。

動的に作成された div にこのドロップ可能なコードを書きました ここに私のコードがあります

$("div.machine").droppable({    

     accept: "#Softwares-List > div",

         activeClass: 'ui-state-hover',

         hoverClass: 'ui-state-active',

         drop: function(event, ui) {

             var dropElem = ui.draggable.html();

             clone = $('dropElem').clone(); 

         clone.id="newId";

         clone.css("position", "absolute");

         clone.css("top", ui.absolutePosition.top);

         clone.css("left", ui.absolutePosition.left);

             clone.draggable({ containment: 'parent' ,cursor: 'crosshair'});

             $(this).append(clone);

            alert("done dragging");

            },

});

しかし、ドロップ可能な関数が呼び出されていません。また、droppable で変更があった場合は、教えてください。

4

2 に答える 2

1

$("div.machine").droppable({divを作成する前に呼び出していますか?

#add クリック イベント ハンドラの最後に移動するだけです。

于 2012-06-08T07:14:45.513 に答える
0

どのブラウザでテストしていますか?

最後のパラメータの末尾のコンマは、IE の一部のバージョンで

            $(this).append(clone);

            alert("done dragging");

            },  <<----

});
于 2012-06-08T07:23:13.633 に答える