javascript - Google Chrome 中的 MouseUp 和 MouseDown 事件

Question

我有一个简单的 html5/canvas 和 js-setup:

HTML

<canvas id="canvas" width="500" height="500" ></canvas>

JS

var canvas = $("#canvas"),
    c = canvas[0].getContext("2d");

c.fillStyle = "gray";
c.fillRect(0, 0, 500, 500);

$(document).mousedown(function() {
    console.log('down');
});
$(document).mouseup(function() {
    console.log('up');
});

令我兴奋的是我能够像这样使用 google chrome 记录事件

down
up
down
up
down 
down 
down 
down
up
down
down
down

意思是，我收到连续的向下事件。我认为这是由 canvas 元素引起的，因为没有它我无法重现此行为。

这是一个 fiddle :http://jsfiddle.net/SunnyRed/zcmaT/

更新

我认为只有当用户单击并拖动时才会发生这种情况，在我的场景中可能就是这种情况。这里是一个简单的点击demo 。我无法在 Firefox 和 Opera 中重现它。

Answer 1

我可以在您的演示中复制此内容的唯一方法是:

• 在页面外部(在 JS fiddle 的另一个 iframe 中)开始单击，然后将鼠标放在 Canvas 上。或者
• 开始在 Canvas 上单击，然后将其释放到页面边界之外(例如在页面内边距上方)。

我相信这是正确的行为。