jquery之为什么我可以禁用但无法启用可删除功能

我只需要一个放置区域中的 1 个方 block ，并根据需要进行切换。为什么我可以禁用但无法启用可删除功能？

• $(this).droppable("option", "disabled", false); - 不起作用
• $(this).droppable("enable"); - 不起作用
• Enable a droppable after it has being disable - 不起作用

这是我的代码:

$('.my_block').draggable({ 
    revert: "invalid",         
}); 
 
$('.free').droppable({          
    accept: ".my_block", 
    drop: function(ev, ui) {              
        $(this).removeClass("free");     
        $(this).addClass("1");                 
        ui.draggable.appendTo($(this)).removeAttr('style'); 
            $(this).droppable("disable");               
        }, 
        out:  function(ev, ui) {                      
            $(this).droppable("enable");     
            $(this).removeClass("1");     
            $(this).addClass("free");             
        },         
    }); 

jsfiddle http://jsfiddle.net/4ABCN/2/

如何一键将所有红色方 block 退回到主位置？

请您参考如下方法:

工作演示 已删除旧演示

新演示试试这个:http://jsfiddle.net/7EbKS/

行为:现在，当用户移动红色框时，您可以将另一个框放在空位置，

希望它符合原因:)

代码

  $(function() { 
    foo(); 
 
    $('.my_block').draggable({ 
        revert: "invalid", 
        stop: function() { 
            $(this).draggable('option', 'revert', 'invalid'); 
        } 
 
    }); 
 
    function foo() { 
        $('.block').droppable({ 
            greedy: true, 
            accept: ".my_block", 
            // tolerance: "fit", 
            drop: function(ev, ui) { 
                ui.draggable.appendTo($(this)).removeAttr('style'); 
             } 
        }); 
    } 
    $('.my_block').droppable({ 
        greedy: true, 
        tolerance: 'touch', 
        drop: function(event, ui) { 
            ui.draggable.draggable('option', 'revert', true); 
        } 
    }); 
 
});