防止鼠标拖动时选择文本

Question

如果不使用传统方法e.stopPropagation（相关问题在底部），我如何防止文本选择？
我可以打电话说 "unhighlight whatever is highlighted" 吗？

我在文档上绑定了鼠标事件，因为页面中有大约一百个 [或多或少] 个元素需要相互交互。

我不将事件绑定到元素的原因是当鼠标离开元素时，所有鼠标事件都会停止触发。我需要绑定到文档才能正确观看鼠标事件。

使用传统方法（下图link）的问题在于，在触发侦听器时，带有文本的元素已经评估了鼠标事件。

我的代码适用于 Chrome。以下问题适用于 Firefox。

相关问题： How can I prevent text/element selection with cursor drag
这谈到防止冒泡到文本元素：

if(e.stopPropagation) e.stopPropagation(); if(e.preventDefault) e.preventDefault(); e.cancelBubble=true; e.returnValue=false; return false;

Answer 1

您可以使用 css 禁用元素上的选择。

.noselect {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

Answer 2

抱歉删除了我的最后一个答案，但我意识到它在 FF 中仍然不起作用。

我相信这个答案，连同上面的 CSS 答案，将产生您正在寻找的结果。这是一个跨浏览器的解决方案。

var unFocus = function () {
  if (document.selection) {
    document.selection.empty()
  } else {
    window.getSelection().removeAllRanges()
  }
}

调用了 onmouseup 并且 onmousemove 成功了。

这是 fiddle：http://jsfiddle.net/z2kpcwb6/

防止鼠标拖动时选择文本

Prevent text selection on mouse drag

javascript

events