Question

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

我需要的是，当我单击鼠标左键时，我的播放器对象（Player1.isLeftClick）中的变量变为true，当我松开按钮时，相同的变量变为false。使用鼠标右键也会发生同样的事情，但是使用另一个变量（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。

Answer 1

您希望使用e.button属性来检查调用了哪个鼠标事件。单击鼠标左键的值为different in 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);

Demo

JavaScript左右键单击功能

1 个答案: