我正在使用这个jquery脚本来初始化packery，将draggabilly添加到.grid-item元素，并启用/禁用拖动功能。
我对javascript / jquery不太了解，但是我尝试将我的代码与在codepen.io上找到的示例以及以下问题进行比较：
Is there a way to make only part of a Packery/Draggabilly container draggable?
Packery和Draggabilly的示例和文档：https://packery.metafizzy.co/draggable.html#draggabilly
https://draggabilly.desandro.com/
关于Codepen的可拖动示例：https://codepen.io/desandro/pen/xbyEyO
似乎没有人让我的代码可以处理。
<body>
<div class="row">
<div class="">
<button class="toggle-drag-button">Toggle drag</button>
</div>
</div>
<div class="grid">
<div class="grid-sizer"></div>
<div class="gutter-sizer"></div>
<div class="grid-item">
<div class="title-wrapper">
<span>FontAwesome</span><span>Title text</span>
</div>
</div>
</div>
<script>
var $grid = $('.grid').packery({
// options
itemSelector: '.grid-item',
gutter: '.gutter-sizer',
percentPosition: true,
horizontalOrder: true
});
// collection of Draggabillies
var draggies = [];
var isDrag = false;
// make all grid-items draggable
$grid.find('.grid-item').each( function( i, gridItem ) {
var draggie = new Draggabilly( gridItem, {
handle: '.title-wrapper'
});
draggies.push( draggie );
// bind drag events to Packery
$grid.packery( 'bindDraggabillyEvents', draggie );
});
$('.toggle-drag-button').on( 'click', function() {
var method = isDrag ? 'disable' : 'enable';
draggies.forEach( function( draggie ) {
draggie[ method ]();
});
// switch flag
isDrag = !isDrag;
});
</script>
</body>
即使在托管链接和图像的内部使用CSS3 Grid的情况下，打包程序和拖动控件也可以按预期工作，但是在添加{handle：'.title-wrapper'}时，此方法无效。
最佳答案
如果它在没有句柄的情况下起作用，但在之后没有起作用，则说明您拼写了错误的值（因此，句柄无法与选择器匹配），或者标记不是您布置的方式。如果在删除Draggabilly构造函数的第二个参数时不起作用，则您的初始化逻辑错误。 PS我假设您在简化附加代码时未在类。toggle-drag-button中包含按钮，但标记中缺少它，并且单击处理程序未绑定任何内容。
-编辑-
在您的标记中，您同时具有.grid-sizer和.gutter-sizer。我认为你们不需要两者。
您的问题是您的装订线与percentPosition结合在一起。在此处查看工作示例：https://codepen.io/yonywithawhy/pen/qgdjar
确保在.gutter-sizer上设置了宽度。如果不这样做，您将看到第二个方块跳得很远。看起来这些块不可拖动，但事实并非如此-很难看到。如果将底部div一直拖动到顶部并松开，则会看到框的更改顺序。没有宽度大小，不能使用percentPosition。
关于javascript - 为什么我的packery.js + draggabilly.js'.handle'不起作用？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/54316018/