如何防止双击选择而不是 css 的常规选择

Question

我想要工具 text button。

所以用户应该点击它。但是当用户点击两次时，句子周围就会出现 selection 标记。所以我想防止这种行为，但因为区域和按钮文本本身只是文本，我想让用户能够像正常 selection 一样使用鼠标手势 select 文本。

所以，简而言之。我如何防止双击 selection 但不是常规的 selection 并使解决方案具有挑战性 CSS

Answer 1

尝试使用 onselectstart="return false" onmousedown="return false" 属性。像这样：

<input type="button" value="Button text" onselectstart="return false" onmousedown="return false" />

Answer 2

来自其他问题

document.addEventListener('mousedown', function (event) {
  if (event.detail > 1) {
    event.preventDefault();
    // of course, you still do not know what you prevent here...
    // You could also check event.ctrlKey/event.shiftKey/event.altKey
    // to not prevent something useful.
  }
}, false);

//one line verstion
document.onmousedown = e => ((e.detail > 1)? (e.preventDefault():'')

如何防止双击选择而不是 css 的常规选择

How prevent double click selection but not regular selection with css

html

javascript

css

mouse