0

我正在使用 HTML5 画布制作游戏。在 Internet Explorer 中拖放时有一些奇怪的行为。它在大多数情况下都有效,但大约十分之一的时间会显示无法拖动图像符号(带有十字的小圆圈)。发生这种情况后,当我松开鼠标按钮时,图像将跳到适当的位置,然后尽管鼠标按钮向上,但它仍会跟随鼠标,就像mouseup事件从未发生过一样。这在任何其他浏览器中都不会发生,这让我认为这不是我实现拖放的方式。

即使我的拖放代码有问题,我也不明白为什么它会显示这个符号。它怎么会知道我正在尝试拖动图像?以前有没有人经历过这种情况,您对此做了什么?

我认为没有必要发布任何代码,因为它只是标准的拖放,虽然我有自己的输入类,所以它可能看起来很混乱。但我现在要谈谈一些细节。

如果在该帧按下鼠标,我会检查它是否在其中一个可拖动的图像上。如果是下一次在鼠标按钮仍然按下时移动鼠标,则图像将移动到鼠标的新位置减去偏移量。

每次释放鼠标时我都会删除鼠标移动事件侦听器,并在每次按下鼠标按钮时添加事件侦听器。我将每个 mousedown 和 mouseup 事件存储在一个数组中,并在每一帧上循环这些事件以设置适当的标志。( wasPressed, wasReleased, isDown, 等等) 我只存储最近的 mousemove 事件。然后我从我的游戏循环中查询这些标志。

4

1 回答 1

1

确保你没有让任何事件冒泡,通常这意味着调用e.preventDefault();你的 mouseodwn/move/up 事件

此外,您应该防止在画布上进行选择,这应该会阻止一些拖动和双击错误:

canvas.addEventListener('selectstart', function(e) { e.preventDefault(); return false; }, false);

于 2012-09-04T17:07:21.447 回答