网格员动态添加的小部件使可拖动

Gridster dynamically added widget make draggable

本文关键字:拖动 小部 动态 添加 网格      更新时间:2023-09-26

我一直在寻找这个问题的答案。我发现唯一相关的话题就是这个。然而,这似乎从未得到解答。

我的

问题是:如果我动态地向我的 gridster 对象添加新小部件,尽管我需要它,但这个小部件是不可拖动的。如何实现此功能?

我的网格器对象是这样创建的:

$(function(){
    gridster = $(".gridster ul").gridster({
      widget_base_dimensions: [gridbase_x, gridbase_y],
      widget_margins: [5, 5],
      helper: 'clone',
      resize: {
        enabled: true
      }
    }).data('gridster');
  });

我的小部件是这样添加的:

            gridster.add_widget("<iframe id='"myframe'" src='"web/widgets/"+wname+".html'" width='""+wwidth+"'" height='""+wheight+"'" frameborder='"0'"></iframe>", wblocks, hblocks, 1, 2 );

您可以假设小部件HTML中的参数是正确的,我已经对此进行了测试。

gridster.add_widget("<iframe id='"myframe'" src='"web/widgets/"+wname+".html'" width='""+wwidth+"'" height='""+wheight+"'" frameborder='"0'"></iframe>", wblocks, hblocks, 1, 2 );

上面的代码将不起作用,除非您必须在add_widget函数中添加 li 标签,例如

gridster.add_widget("<li class="gw_s"><iframe id='"myframe'" src='"web/widgets/"+wname+".html'" width='""+wwidth+"'" height='""+wheight+"'" frameborder='"0'"></iframe></li>", wblocks, hblocks, 1, 2 );