jQuery droppble問題

Question

我已經寫了jQuery代碼，允許用戶在屏幕上創建2個框，然後將其中一個拖放到另一個框中。從HTML的角度來看，是這樣的......

<div id="1"> 
    <div id="2"> 
    </div> 
</div> 

如果我再創建另一個框，並將其拖到箱2，並把它，它總是投進箱1（即箱2的母公司）。我想是這樣的......

<div id="1"> 
    <div id="2"> 
     <div id="3"> 
     </div> 
    </div> 
</div> 

...但我得到的是這樣的......

<div id="1"> 
    <div id="2"> 
    </div> 
    <div id="3"> 
    </div> 
</div> 

你[以前是能] 可以 看到這個發生在這裏。 .. http://acarna.com/editor.php < - 我已經解決了這個問題...看到我的回答如下

點擊左上方的「H」按鈕創建一個框。抓住盒子右上角的灰色方塊，將其拖入頁面中。將鼠標移動到框的邊緣或角落並調整其大小。

然後再次單擊「H」創建框2.將框2拖放到框1中。此功能正常工作。如果您使用Firefox，您可以在鼠標懸停時將其添加到方框1中，因此可以看到方框。

我遇到的問題是創建方框3時，將它移動到方框2上並嘗試將其放入方框內。它只檢測盒子1並將其放入其中。

是否有一些技巧我錯過了jQuery檢測框2時，框3拖過來，並有它添加在那裏呢？

Answer 1

我只是在與jQuery UI（ahem）稀少文檔掙扎之後有了一段清晰的時間。

可放下的選項'貪婪'決定了一個對象落在可放置對象的樹上時將要放置的位置。

設置爲false（默認值）時，被放置的對象將落在樹中最低的可放置對象上。設置爲true時，被放置的對象將着陸在樹中的第一個（即最高）可放置對象上。

這可以通過示例使用以下標記來證明。想象一下以下的div均投擲的對象......

<div id="bottom_container"> 
    <div id="level_2_container"> 
     <div id="level_3_container"> 
     </div> 
    </div> 
</div> 

可拖動對象（給定id =「all_new_container」下方）掉落在DIV＃level_3_container。下面是一個結果，如果貪婪是假的（即默認值）的標記......

<div id="bottom_container"> 
    <div id="level_2_container"> 
     <div id="level_3_container"> 
     </div> 
    </div> 
    <div id="all_new_container"> 
    </div> 
</div> 

而這裏的貪婪，如果設置爲true時產生的標記......

<div id="bottom_container"> 
    <div id="level_2_container"> 
     <div id="level_3_container"> 
      <div id="all_new_container"> 
      </div> 
     </div> 
    </div> 
</div> 

如果您有螢火蟲當你將物體掉落到這裏的其他對象你看上面的事情發生...... http://acarna.com/editor.php

請原諒有新的下降元素放錯了地方的土地超過2級我不會固定，定位錯誤的上面的例子，一個d上述演示沒有必要這樣做。