使用网格还原“无效"不会通过jQuery UI Draggable返回到起始位置 [英] revert 'invalid' with grid doesn't return to start position with jQuery UI Draggable

问题描述

简而言之，如果您将可拖动项与网格一起使用并在可拖动项上设置还原:无效"，它们将不会返回到与您开始拖动它们完全相同的位置.它们返回到您开始拖动它们的地方附近……很奇怪.

这很可能是UI中的错误.如果是这样，有人知道它是否有解决方法吗?

示例: http://jsfiddle.net/n2AUv/11/

谢谢！ 约翰.

解决方案

grid选项文档说:

将拖动的 helper 捕捉到网格，每个x和y像素.

因此，看起来grid被设计为仅与某种帮助程序一起使用.实际上，如果您使用helper: "clone"会很好:助手返回原始实例和

的位置附近

是的，这看起来像UI中的错误. 但是有一种解决方法:使用辅助工具进行拖动:

$(".dragme").draggable({
    revert: true,
    helper: "clone",
    grid: [50,50]
});

此变通办法引入了其他奇怪的错误:在可放置区域帮助程序上的有效放置被破坏并且原始实例存在于该位置后(您可以在这段代码可拖动.

In a nutshell, if you use draggable with a grid and set revert: 'invalid' on draggable items they don't return to exactly the same place you started dragging them from. They return to a place close to where you started dragging them...pretty weird.

This could well be a bug in UI. If so, does anyone know if there's a workaround for it?

Example: http://jsfiddle.net/n2AUv/11/

Thanks! John.

解决方案

grid option documentation says:

Snaps the dragging helper to a grid, every x and y pixels.

So it looks like grid was designed to be used only with some kind of helper. And really, if you use helper: "clone" things are good: helper returns near the place of original instance and

Yes, this looks like a bug in UI. But there's a workaround: use helper for dragging:

$(".dragme").draggable({
    revert: true,
    helper: "clone",
    grid: [50,50]
});

This workaround introduces other weird bug: after a valid drop on droppable area helper gets destroyed and original instance exists in it's place (you can see it at fiddle).

This bug somehow solved for draggable with connectToSortable options. Maybe it's possible to solve the bug in your case too.

Also, I suspect the whole mess is because of this chunk of code in draggable.

这篇关于使用网格还原“无效"不会通过jQuery UI Draggable返回到起始位置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！