0

私には2つの列があり、これらの2つの列をドロップ可能にしました。それらのいずれかを「オーバー」すると、子として新しい「リスト」を作成しています。

しかし、新しい子をドロップすることはできません。ドラッグしたリスト要素を子要素に追加する必要があります..

ここに私が書いた私の関数があります:

 var generate = function (id) {

  var id = "#" + id, c = 0, ul = $("<ul />");

  $(id).empty();

    while(c < 10 ) {
      c ++;  
        ul.append($("<li />", { text : c + " new list"}));
    }

    return ul;

}


$("li").draggable({

    revert:true,
    helper: "clone"

});

$(".cl").droppable({
    accept: "li",
    activeClass : "highLight",
    over: function( event, ui ) {

       var elements = generate(event.target.id);

        $("#" + event.target.id).append(elements);

        $(".cl li").droppable({
            over : function (event, ui ){
                console.log("it is over now!"); // not working
            },
            drop : function () {
                console.log ("dropped");
            },

out : function () {
 console.log ("I am out") // not working..
}


            });

        }
    });

ライブデモはこちら

誰でもこの問題を整理するのに役立ちます..新しい子はドロップ可能になり、ドラッグ可能なリストのコピーを追加します..?

前もって感謝します..

4

1 に答える 1

1

問題は、マウスが列の上を移動するたびに最上位の子を再生成することです。over: 関数の先頭に次のコードを追加して修正します。

if (event.target._generated)
    return;

event.target._generated = true;

これが実際のFIDDLEです: http://jsfiddle.net/eM8CX/

于 2013-10-24T13:37:54.810 に答える