【问题标题】:javascript mouseover while dragging拖动时javascript鼠标悬停
【发布时间】:2010-12-21 07:59:04
【问题描述】:

我正在尝试实现一个拖放脚本,但遇到了一个问题。当您拿起一个项目并开始拖动它时 - 该项目直接位于您的光标下方,并且很少会在下面的项目上触发 onmouseover 事件。但是当我将某些东西拖到它们上面时,我希望其他项目突出显示。一种解决方案是根本不拖动任何东西——这样鼠标事件就会起作用,但这看起来很难看。有没有人做过这样的事情并且知道如何克服这个问题?

如果您正在考虑推荐一些 JQuery 插件或类似的东西 - 请不要。我不需要完整的解决方案,这是有教育意义的。

【问题讨论】:

  • 另外,我知道我可以在移动鼠标时检查我是否在一个元素的范围内并突出显示该元素,但这似乎太……如果这是一个正确的词的话。
  • 要检查的元素是否在绝对范围内?
  • 嗯,该解决方案应该适用于任何元素。检查边界不是问题,问题是我不想指定哪些元素是“可放置的”,理想情况下我想要在所有被拖动的元素上触发的“dragOver”事件。但我想这些天唯一的解决方案是要么拥有一个“可放置”的元素列表,要么循环遍历所有组件。
  • 这基本上是因为您已经持有一个元素并且没有指向任何其他元素,您可以尝试一件事不要拖动它只需单击它并使其聚焦然后移动鼠标,这可能会有所帮助..虽然不确定,但它可能会改变您的功能

标签: javascript drag-and-drop


【解决方案1】:

IMO,为了频繁触发 mouseover 事件,将绑定 mouseover 事件到所有受影响元素的 parent 元素,或者可能绑定到 document 本身,因为事件冒泡,它们可能是唯一可以触发 mouseover 事件的元素。

然后,在mouseover 事件中编写一个hit 方法并主动检查鼠标光标的位置,看看它是否在目标元素的边界之下。可用性和性能的权衡。你选择。

我的 2cents。

或者,您可以对jQuery UI 进行逆向工程,看看他们是如何实现拖动元素的。没有检查你,但我认为应该有更明智的方法。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2011-09-26
    • 2016-04-10
    • 2017-10-14
    • 1970-01-01
    • 2012-01-26
    • 2015-08-08
    • 2012-05-04
    • 1970-01-01
    相关资源
    最近更新 更多