允许 Gridstack 仅可拖动到项目的特定区域

Posted 2023-02-19

【中文标题】允许 Gridstack 仅可拖动到项目的特定区域

【英文标题】：Allow Gridstack draggable only to a specific area of the item

【发布时间】：2017-08-19 16:20:51

【问题描述】：

我正在使用 Gridstack js 为仪表板创建可拖动/可调整大小的小部件。图片显示了一个示例小部件。我保留了默认的可拖动值，我可以通过双击小部件内的任意位置来拖动它。我想要做的是仅通过单击灰色区域使小部件可拖动。是否应该为此覆盖默认的可拖动值？如果有怎么办？我对 jquery/js 还很陌生，在互联网上找不到类似的东西。

【参考方案1】：

假设您使用 gridstack 的默认 jQueryUI 可拖动，您可以使用取消选项重新设置可拖动构造函数，并在您希望不可拖动的任何元素上进行。在下面的代码中，将not-draggable 类添加到网格堆栈项内的任何 div 都会抑制其拖动。

$('.grid-stack-item').draggable(cancel: "div.not-draggable" );

【讨论】：

非常感谢。我几乎放弃了我想做的事情，因为我找不到解决办法..

是的，我自己花了一些时间才弄清楚，早些时候偶然发现了你的问题，并认为一旦我为自己工作，我就会分享。 :)