【问题标题】:jQuery draggable/droppable doesn't drop where mouse cursor isjQuery 可拖放/可拖放不会放在鼠标光标所在的位置
【发布时间】:2014-08-13 09:20:39
【问题描述】:

(JSFiddle 在底部)

在我正在开发的应用程序中,用户可以将 jQuery UI 可拖动项从平面列表映射到叶节点是 jQuery UI droppables 的树上。平面列表中的项目可以一一映射,但用户也可以使用多选来抓取任意数量的项目,然后一次性将它们拖放到同一个 droppable 中。

当用户选择大量项目时,可拖动助手会变得很长。这会在尝试将项目放在靠近树底部的节点上时导致问题。

我所追求的行为是将项目放置在鼠标光标当前所在的叶节点(可放置)上。这似乎在所有情况下都有效,除非您到达列表底部。光标将向下移动,但可拖动对象将保持原位(不能再进一步)。而不是拖放到鼠标光标所在的可放置对象上,可拖动对象将被放置在鼠标光标 预期位置下方的可放置对象上(基于 cursorAt 属性),或者至少看起来是 。

我尝试了许多设置和更改,但我无法控制这种行为。我发现使用搜索指向可放置对象上的tolerance: "pointer" 设置的大多数解决方案,但我已经使用了它,但它并不能解决问题。我的助手克隆了可拖动对象并在其上设置了“指针事件:无”,但这似乎也无关紧要(我也可以删除助手函数并且行为相同)。

这是一个错误吗?有没有办法解决它?帮助将不胜感激。如果需要更多信息,请告诉我。谢谢!

JSFiddle 重现问题:http://jsfiddle.net/1odvbmah/4/

编辑:免责声明:JSFiddle 是我可以重现该问题的最简单方法。因此,有些事情与实际情况并不完全一样。我将可放置容器卡在底部以限制可拖动。在实际情况下,droppables 列表是可滚动的,但可拖动项不能超出该列表的底部。产生的行为完全相同。所以一个小的 CSS 改变并不能解决我真正的问题:)

第二次编辑:更改 cursorAt 值也不是解决方案。在实际情况下,draggable 可以变得比屏幕高度高,而树形控件(带有 droppables)几乎是整个页面高度。

【问题讨论】:

  • 我不知道我是否理解你的问题,但如果它是可拖动的卡在窗口底部。为什么不初始化光标顶部,左侧到可拖动的'90%'左右。 cursorAt: { left: 90, top: 90}
  • 因为那样会出现同样的问题,但在顶部。在实际情况下,树形控件与页面一样高,并且可拖动对象可能会变得高于屏幕高度。

标签: jquery jquery-ui drag-and-drop jquery-ui-draggable jquery-ui-droppable


【解决方案1】:

事实证明,这确实是 jQuery UI 中的一个错误。自从我在 jQuery 中寻找错误后,我没有找到它,但显然拖放是在 UI 中。

该错误最近已修复。该修复也解决了我的问题。

http://bugs.jqueryui.com/ticket/4977

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2013-05-12
    • 2012-01-17
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-12-01
    • 2017-10-16
    相关资源
    最近更新 更多