用jquery拖放到一个可拖动的区域

Question

是否可以用一个可拖动的div区域拖放到一个已经可拖放的div和jquery中？我无法做到这一点。如果有人能举一个实例，我将不胜感激。

感谢。

编辑 我无法实现的是一个div，其中不同的div可以被丢弃并且可以被排序。此外，这些丢弃和排序的div也应该同时能够容纳可排序和可丢弃的div。

编辑 我试图做的工作是：http://jsfiddle.net/QcbK8/

Answer 1

如何：threedub，建立在jQuery的。

Answer 2

仅仅因为一个元素是可拖动的并不意味着它不能被拖拽。

我已经为你写了一个小例子，它非常简单，只有一半的元素只是下降，红色边框，一半是放置目标和也可拖动。

演示：http://jsfiddle.net/63kgz/1/

HTML：（一些随机的对象）

<div class="drag"><span>A</span></div> 
<div class="drag"><span>B</span></div> 
<div class="drag"><span>C</span></div> 
<br class="clear" /> 
<div class="drop"><span>D</span><p></p></div> 
<div class="drop"><span>E</span><p></p></div> 
<div class="drop"><span>F</span><p></p></div> 

CSS：（忽略这一点，它只是显示了随机对象）

.drag { width: 100px; height: 100px; 
     float:left; margin-bottom: 10px; margin-right: 10px; 
     border:1px solid #f00; 
} 
.drop { width: 200px; height: 200px; 
     float:left; margin: 10px 10px 10px 10px; 
     border: 1px solid #000; 
} 
.drop p { width: auto; 
      color: #00f; 
      margin-left: 50%; margin-right: 50%; margin-top: 25%; margin-bottom: 25%; 
} 
.clear { clear: both; } 
div { 
    user-select: none; 
    -o-user-select:none; 
    -moz-user-select: none; 
    -khtml-user-select: none; 
    -webkit-user-select: none; 
} 

的jQuery：

// Everything is draggable 
$('.drag,.drop').draggable(); 

// Only the .drop class is droppable 
$('.drop').droppable({ 
    'accept': '.drag,.drop', 
    'drop' : function(event, ui) { 
     $(this).find('p').text(ui.draggable.find('span').text()); 
    } 
}); 

// This just makes the sizes different so the objects fit in each other 
$('.drag').css('width', function(i, value) { 
    return parseInt(value) * (1/(i + 1)) + 'px'; 
}).css('height', function(i, value) { 
    return parseInt(value) * (1/(i + 1)) + 'px'; 
}); 
$('.drop').css('width', function(i, value) { 
    return parseInt(value) * (1/(i + 1)) + 'px'; 
}).css('height', function(i, value) { 
    return parseInt(value) * (1/(i + 1)) + 'px'; 
});