jQuery的导致错误和CSS使用此代码（的jsfiddle）坚持

Question

林 - JSFIDDLE

当项目被拖动到正确的盒子，它禁止被再次拖了原来的。问题在于它会导致css粘住，使得接受被拖动物品剂量的盒子的绿色消失。

它在控制台还产生这样的错误：

未被捕获的错误：不能调用上拖动的方法来初始化之前;试图调用方法'禁用'。

任何帮助都会很好。

另外我怎样才能改变残疾人士的颜色为灰色。

JS：

$(".DragItem").draggable({ 
    revert: 'invalid', 
    helper: "clone" 
}); 

$(".drop1").droppable({ 
    accept: '#1,#2,#3', 
    activeClass: 'DropTargetValid', 
    drop: function (ev, ui) { 
     $(ev.target).draggable('disable'); 
     $(ev.target).append(ui.draggable.clone()); 

    } 
}); 

$(".drop2").droppable({ 
    accept: '#2,#3', 
    activeClass: 'DropTargetValid', 
    drop: function (ev, ui) { 
     $(ev.target).draggable('disable'); 
     $(ev.target).append(ui.draggable.clone()); 
    } 
}); 

$(".drop3").droppable({ 
    accept: '#3,#4', 
    activeClass: 'DropTargetValid', 
    drop: function (ev, ui) { 
     $(ev.target).draggable('disable'); 
     $(ev.target).append(ui.draggable.clone()); 
    } 
}); 

$(".drop4").droppable({ 
    accept: '.DragItem', 
    activeClass: 'DropTargetValid', 
    drop: function (ev, ui) { 
     $(ev.target).draggable('disable'); 
     $(ev.target).append(ui.draggable.clone()); 
    } 
}); 

Answer 1

我相信这是你正在寻找http://jsfiddle.net/vm9DS/48/

首先，我删除的ID从可拖动对象，因为当你克隆他们，你结了很多具有相同ID的元素，这是不允许的。

至于其余代码：

代码只是删除这一行

$(ev.target).draggable('disable'); 

它不工作，因为ev.target是可放开对象不能拖动，并导致错误:)

而对于灰色只需添加这的CSS，所以每当你在掉物品开关DROPITEM掉落dragItem它会改变的背景为灰色:)

.DropItem .DragItem{ 
    background-color: grey; 
} 

Answer 2

JSFiddle

可以初始化拖动与$(ev.target).draggable();