我遇到了这个问题，我有一个图像上的 onclick 事件，但是当鼠标在 mousedown 和 mouseup 事件之间移动时，它不会被触发。
我有一个图像,我想有一个 onlick 事件。我也不希望任何人拖动 / 选择或打开上下文菜单。现在我发现在触摸屏上 50% 的时间人们点击一些图像会发生什么,当他们按下图像时他们的手指移动。所以在 mousedown 和 mouseup 事件之间有一个微小的区别。但是当他们这样做时,点击事件不会被触发 (至少在 chrome 中)。
看看这个：https://fiddle.jshell.net/08pbjfq2/1/
点击图像将显示一个警报和鼠标上下事件，但是当你点击并使用鼠标移动超过 3 个像素左右时，点击和鼠标向上事件不会被触发。它还显示，如果你点击，然后将鼠标移动 1 个像素，mousedown 事件和 onclick 事件被触发，但不是 mouseup 事件。这是一个错误还是我在这里缺少一些东西？
1
这看起来像一个 chrome bug。
发生这种情况是因为您正在阻止拖动事件，该事件不应链接到单击事件。
解决方法:
您可以通过在 chrome 中设置draggable="false"属性来防止拖动，但 FF 不支持它。
var img1 = document.images[0];
img1.ondragstart = e => e.preventDefault();
img1.onclick = e => console.log('clicked first');
// to show that this is the problem in chrome :
var img2 = document.images[1];
img2.ondragstart = e => e.preventDefault();
img2.onclick = e => console.log('clicked second');/* CSS can prevent selection */
img{
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}<img draggable="false" src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTS0G-xT5r9xjdGAHlvZk2wdZVhyP6LOpOJE7PyNLXdUCs0pG-gqA"
/>
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTS0G-xT5r9xjdGAHlvZk2wdZVhyP6LOpOJE7PyNLXdUCs0pG-gqA"
/>本站系公益性非盈利分享网址，本文来自用户投稿，不代表边看边学立场，如若转载，请注明出处
评论列表（60条）