在window.resize事件

Question

无论出于何种原因，本机在Chrome中，紧跟mousemove事件后的mousedown个事件都没有触发，或者在mousedown之后的一小段时间内（500-1000毫秒？）被完全忽略{1}}事件。

奇怪的是，这个问题在codepen上是不存在的（在Chrome上也是如此）而且代码完全相同...... Firefox，Edge等也没有问题，只在Chrome上本身存在

Here is a codepen nonetheless.自行测试。

将此代码复制并粘贴到实际的.html，.css和.js文件中，然后直接在浏览器中运行它，您会注意到paper.onmousemove在{{window.resize之后不会立即触发或注册1}}事件很短的时间。

这一切都没有任何意义！

有人知道发生了什么事吗？ 为什么它在codepen（以及所有其他浏览器）中运行良好，但不能直接在浏览器中运行？！

我发现了一个与codepen版本有关的问题，它会产生一个非常类似的错误（但在开头会涉及一些额外的步骤）。

1. 通过在白色区域拖动鼠标来创建元素
2. 点击选择该元素
3. 将该元素拖到页面上的任何位置
4. 调整浏览器大小并立即尝试通过拖动
创建另一个元素

但是，在这种情况下，代码集mousedown没有触发，而如果直接在浏览器中查看，则mousemove不会触发。同样，存在差异，这非常奇怪。

更新

事实证明它只发生在开发者控制台打开时，这就是它在codepen中没有发生的原因。

Answer 1

这似乎是Chrome DevTools的一些奇怪之处。您描述的错误似乎只发生在DevTools打开时。当你关闭DevTools时它会消失。这可能只是一个奇怪的巧合，但当右上角的分辨率标签消失时，它会立即开始记录mousemove个事件。

话虽如此，你有onmousemove和addEventListener的组合。例如，你有两个

paper.addEventListener('mouseup', checkMouseUp)

和

paper.onmouseup = function(event) {}

我不确定它是否是DevTools问题的原因，但这会导致意外后果，因为paper现在有两个单独分配的mouseup功能。在您的情况下，我只是坚持addEventListener。