JQuery UI可拖动无法正常工作

Question

$(function () {
    $(".draggable").draggable()(
        { 
            snap: ".snap",
            revert: true
        });

        $(".droppable").droppable({
                over: function() {

                }
        });
    $(".snap").droppable({
        drop: function (event, ui) 
        {
            var drag = ui.draggable;
            var drop = $(this);
            $(this).html(drag.html());
            $(this).attr('name', drag.attr('id'));
        }
    });
});

JSFiddle link

编辑：解释JSFiddel：想要的是左侧div（侧边栏和内容）可拖动和可恢复。然后，当我将这些拖动到右侧的3个水平div时，div文本将成为保存，因为div上的文本放在它们上（侧边栏或内容），而小div将恢复到位置。 （这样，用户可以选择是否需要例如3个内容或1个侧边栏和2个内容或2个边栏和1个内容。