0

ドロップ可能で異常な問題が発生しています。私はたくさんのコードを持っているので、質問をできるだけ単純化しようとします。

コンテナー (ウィンドウのサイズ) 内にドロップ可能な 2 つの div があります。div1 は 5000px x 5000px で、ページの中央にあります (AKA 多数のオフセット位置があります)。div2 は、コンテナー内の最初の div の上に絶対に配置されます。幅はコンテナーの 100%、高さは約 50px です。

また、ある div から別の div に移動する必要があるドラッグ アンド ドロップ項目がたくさんあります。

問題は、項目を div2 から div1 に移動すると、再び div 2 に戻らないことです。それらは単に div の下に移動し、div1 に残ります。コードを投稿したいと思っていますが、役立つかどうかわかりません。

現在、各ドラッグ アンド ドロップ div で greedy:true を使用しています。

何か案は？前もって感謝します。

編集

これはdiv2のjqueryです

$("#bs-quickAdd-que").droppable({
            accept: ".bs-items",
            drop: function( e, ui ){
                var $this = ui.draggable; // the element being dragged
                $this.addClass("bs-que-items item-in-que");
                $("#bs-quickAdd-que").css({"background-color": "transparent"});
            },
            over: function( e, ui ){ // when drag of the que box
                var $this = ui.draggable; // the elementbeing dragged
                $this.appendTo("#bs-quickAdd-que").removeClass("item-in-grid");

                $("#bs-quickAdd-que").css({"background-color": "#fff"});
            },
            out: function( e, ui ){
                var $this = ui.draggable; // the element being dragged
                $this.appendTo(elem).addClass("item-in-grid").removeClass("bs-que-items");

                $("#bs-quickAdd-que").css({"background-color": "transparent"});
            },
            greedy: true
        });

これはdiv1のjqueryです

elem.droppable({
                accept: ".bs-items",
                greedy: true
            });

ドラッグ可能なアイテムはこちら

$(".bs-items").draggable({
            containment: "window",
            grid: [10,10],
            stack: ".bs-items",
            cursorAt: {top: 15, left: 10},
            drag: function(e,ui){

                var $this = ui.helper, $parent = $this.parent(); // the element being dragged

                if($parent.is("#grid")){
                    thisx = Math.round(e.pageX - elem.offset().left);
                    thisy = Math.round(e.pageY - elem.offset().top);
                }else{
                    thisx = Math.round(e.pageX - $("#bs-quickAdd-que").offset().left);
                    thisy = Math.round(e.pageY - $("#bs-quickAdd-que").offset().top);                   
                }
                ui.position.left = thisx-($this.width()/2);
                ui.position.top = thisy-($this.height()/2);
            }
        });
4

1 に答える 1

4

つまりね。

jQuery UI は、子孫のドロップ可能オブジェクトが で構成されている場合、祖先のドロップ可能オブジェクトがドロップ イベントを受信しないようにします。一方が他方と重複している場合、兄弟またはいとこのドロップ可能オブジェクトがドロップ イベントを受信することは妨げられません。{greedy: true}

これは、jQuery UI による設計上の決定です。彼らはそれを修正するつもりはありません。

于 2013-07-11T08:08:46.953 に答える