单击图像时接收（不需要的）mousemove事件

Question

我有一个html页面，在这个页面上有一些图像，当用户点击其中一个图像时，不同的图像会替换它。

<img style="cursor:hand" src="../_Img/click_me.png" onclick="ChangePic();">

ChangePic（）函数：

function ChangePic() {
var el = event.srcElement;
el.src = '../_Img/Clicked.png';}

我在页面上还有一个标签，用于显示当前的操作，例如：移动/右键单击/左键单击/双击。

在我的html页面上，我有：

onmousemove="ShowAction('Move');" onmousedown="ShowKeysDown('Left','Middle','Right','click');"

显示操作只会更改标签。 ShowKeysDown检查单击了哪个按钮，然后调用ShowAction。 （此调用中的字符串用于支持多语言）

我遇到的问题是，当用户单击鼠标左键单击图像时，图像会正确更改，标签会在几分之一秒内变为“左键单击”，然后变为“移动” “即使没有发生任何移动。我认为可能是单击图像被视为拖放程序的开始，但我不确定。

编辑：当用户没有点击图像时，只是在一些随机空格中，标签正确显示为“左键单击”，直到他们移动光标，然后它变为“移动”。这是我点击图片时想要的行为。

感谢您的时间。

注意：这只需要在IE中工作，因为它是mfc中HTMLDialog的一部分。

Answer 1

我假设用户交互发生以下事件：

1. 用户将鼠标移到图像上 - onmousemove - 在标签上显示“移动”
2. 用户点击图片（左键单击） - onmousedown - diaplsya'左键单击'标签
3. 用户将鼠标移出图像 - onmousemove - 在标签上显示“移动”

即使用户将鼠标移动到图像上的一个像素，onmousemove也会触发。

所以问题的解决方案是：

1. 拥有全球旗帜
2. 在onmousedown
的事件处理程序中设置它
3. 检查onmousemove的事件处理程序中的标志，如果未设置，则在标签上显示“Move”，如果已设置则不执行任何操作
4. 有onmouseout的事件hanlder，重置此事件处理程序中的标志，所以每当onmousemove触发时，它将检查标志，因为它没有被click事件设置，onmousemove将在标签上显示“Move”。

希望这是你想要的行为!!!

Answer 2

如果我错了，请纠正我......但是你正在使用onmousemove事件。你所经历的行为是不是绝对正常？

Answer 3

在没有获取mousemove事件的情况下单击对象几乎是不可能的... 你需要以某种方式过滤它 - 比如 - 如果移动太小则忽略它......