2010-11-19 93 views
0

我有兩組可拖拽和兩組可拖拽的元素。在一個頁面上的兩個可拖拽和兩個可拖拽

我想要的是第一組可拖動元素只能在第一組可拖拽內部放置。 第二組可拖拽應該只能放入第二組可放置的物體中。

的代碼段:

// this can be dropped only inside .drop elements 
$('.drag').draggable({ revert: true }); 
$('.drop').droppable({ 
    drop: function() { 
     //   
    } 
}); 

// this can be dropped only inside .drop2 elements 
$('.drag2').draggable({ revert: true }); 
$('.drop2').droppable({ 
    drop: function() { 
     //   
    } 
}); 

所以,用戶將無法與.drag類下降元件.drop2容器。

回答

1

This是你想要的。

使用Accept可放置小部件的屬性和revert可拖動小部件的屬性來實現此目的。

+0

還有一個問題。如果我只有一個可放置的容器,該怎麼辦?我怎麼知道,哪個可拖動的元素被拖到那裏? – 2010-11-19 12:42:37

+0

修改您的拖放功能以刪除:function(event,ui){alert($(ui.draggable).attr(「id」)) $(this).html(「Dropped!」); } – 2010-11-19 12:51:13

+0

使用ui.draggable你可以得到被刪除項目的ID。 – 2010-11-19 12:51:53