使用原生 add_widget 将项目添加到 Gridster.js 网格导致未知错误

Question

我整个上午都在尝试将一个简单的项目添加到 gridster 网格中，但在引用 gridsterjs 时出现错误 add_widget 有人可以给我详细说明如何动态添加小部件吗？

也许我没有正确实例化或缺少依赖项...

$(function(){
    gridster = $(".gridster ul").gridster({
        widget_margins: [10, 10],
        widget_base_dimensions: [140, 140]
    });

    // errors why?
    gridster.add_widget.apply(gridster, ['<li class="gw_s">The HTML of the widget...</li>', 2, 1]); // Cannot read property 'apply' of undefined
    gridster.add_widget('<li class="gw_s">The HTML of the widget...</li>', 2, 1); // Uncaught TypeError: gridster.add_widget is not a function

});

Answer 1

这不是您获取 gridster 对象的方式。试试这个：

$(".gridster ul").gridster({
    widget_margins: [10, 10],
    widget_base_dimensions: [140, 140]
});
var gridster = $(".gridster ul").gridster().data('gridster');

现在您可以使用函数gridster.add_widget(html, 2, 1);

使用原生 add_widget 将项目添加到 Gridster.js 网格导致未知错误

Adding an item to Gridster.js grid with native add_widget causing unknown errors

html

javascript

drag-and-drop

gridster