火狐Mousemove event.which

Question

我正在编写一个HTML5画布绘图应用程序，我需要能够判断鼠标左键是否在mousemove事件中被按下。在Chrome上，这是可行的：

if (event.which == 1) { <do stuff> }

但是在FireFox中，无论是否按下按钮，event.which总是1。

如何检测鼠标按钮是否在mousemove事件中被按下？

Answer 1

简而言之，你不能。

当发生鼠标按钮事件时，可以使用多个附加属性来确定按下了哪些鼠标按钮和鼠标指针的位置。事件的按钮属性可用于确定按下哪个按钮，在可能的情况下，左侧按钮为0，中间按钮为1，右侧按钮为2个。如果您的鼠标配置方式不同，则这些值可能有所不同。 ..。 按钮和详细信息属性仅应用于鼠标按钮相关事件，而不适用于鼠标移动事件。例如，对于mousemove事件，这两个属性都将设置为0。

如果需要，您可以设置全局mousedown和mouseup处理程序，这些处理程序可以适当地设置标志，然后在任何给定的时间点上，您可以相对准确地确定是否按下了/哪个鼠标按钮。

Answer 2

您应该使用一个变量来保持鼠标向下的状态。当画布上的mousedown设置为true时，当文档上的mouseup设置为false时..

这样，只要单击.它就会被清除。

就像这样

var isMouseDown = false;

var draw = document.getElementById('draw');

document.addEventListener('mouseup',
                          function(){
                              isMouseDown = false;
                          },
                          false);

draw.addEventListener('mousedown',
                      function(e){
                          e.preventDefault(); // cancel element drag..
                          isMouseDown = true;
                      },
                      false);

draw.addEventListener('mousemove',
                      function(e){
                          if (isMouseDown){
                              // do the drawing ..
                          }
                      },
                      false);

http://jsfiddle.net/gaby/8JbaX/演示

Answer 3

实际上，你可以在火狐上查看event.buttons，它告诉你是否按左键、右按钮或无按钮。你需要一个if语句来区别于没有event.buttons的Chrome。