4

这是我正在制作的 HTML5 画布游戏。在游戏中，有一个角色有枪，他可以射击并重新加载。我希望玩家使用鼠标左键进行射击，使用鼠标右键进行重新加载。

我需要的是，当我单击鼠标左键时，我的播放器对象（Player1.isLeftClick）中的一个变量变为真，当我放开按钮时，相同的变量变为假。鼠标右键也应该发生同样的事情，但使用另一个变量（Player1.isRightClick）。我还希望它能够支持所有最流行的浏览器（Chrome、Firefox、Explorer 等）。 我还必须使用纯 JavaScript，没有像 jQuery 这样的库！ 我已经通过键盘事件实现了这一点，但我需要通过鼠标事件实现这一点。

如果有帮助，我已经有了用于上下键盘和鼠标移动的事件处理程序。这些是在加载图像时初始化游戏的 init 函数中完成的。

document.addEventListener('mousemove', mousePos, false);
document.addEventListener('keydown', checkKeyDown, false);
document.addEventListener('keyup', checkKeyUp, false);

我还有一个名为 mie 的变量，如果使用的浏览器是 Internet Explorer，则该变量为 true，而其他浏览器为 false。

4

1 回答 1

12

您想使用该e.button属性来检查调用了哪个鼠标事件。单击鼠标左键的值在 IE 中是不同的。您的代码如下所示：

var left, right;
left = mie ? 1 : 0;
right = 2;

document.body.addEventListener('mousedown', function (e){
    if(e.button === left){
        Player1.isLeftClick = true;
    }
    else if(e.button === right){
        Player1.isRightClick = true;
    }
}, false);

document.body.addEventListener('mouseup', function (e){
    if(e.button === left){
        Player1.isLeftClick = false;
    }
    else if(e.button === right){
        Player1.isRightClick = false;
    }
}, false);

演示

于 2012-08-25T20:38:34.633 回答