Gridster通过拖动到div删除小部件

Question

我正在使用gridster.js并试图找出一个好方法来设置它,我可以将其中一个小部件拖动到像div这样的"垃圾桶"并让它从网格中删除该小部件.如果有人对此有任何想法会很棒.这是我发现的,但是试图找出使它与gridster一起工作的最佳方法.

$(".widget").draggable();
    $('#trash-can').droppable({
        drop: function(event, ui) {
            $(ui.draggable).remove();
        }
    });

有什么想法吗？提前致谢.

Answer 1

我意识到这个问题有点老了，我不确定你是否仍在寻找解决方案，但我能够通过在 gridster 网格内创建一个 div 并以不同的方式设计它来实现这一点。

我在初始化 gridster 时定义了一个停止函数，这样坐标就在这个 div 内，删除小部件。

var gridster = $(".gridster ul").gridster({
      widget_base_dimensions: [100, 55],
      widget_margins: [5, 5],
      draggable: {
         stop: function(e, ui, $widget) {
         console.log(ui);
            if (ui.position.left >435 ) gridster.remove_widget(ui.$helper[0]);
        }
      }
    }).data('gridster');

这是一个有效的（虽然非常基本）小提琴：http://jsfiddle.net/nrC4J/