如何防止双击使用 JavaScript 突出显示网页文本

How to prevent a double-click from highlighting web-page text using JavaScript?

本文关键字：显示 网页 文本 JavaScript 何防止 双击      更新时间：2023-09-26

在我的HTML页面上有一个带有一些文本的元素。我分配了一个在单击该元素时要执行的操作。当用户连续多次单击元素时，有时会发生双击，这会导致文本被选中(突出显示(，从而损坏外观。我试图使用虚拟事件处理程序来阻止它，该处理程序阻止双击 (dblclick( 事件的默认行为。但是，这似乎不起作用。似乎在我的虚拟事件处理程序被执行之前，文本已被选中并突出显示。

function doNothing(event) {
  alert('doNothing'); // Added for debugging. The alert is shown, meaning the event handler is invoked. When I get the alert, the text is already highlighted.
  if(!event) event = window.event;
  if(event.preventDefault) event.preventDefault();
  event.cancelBubble = true;
  if(event.stopPropagation) event.stopPropagation();
  return false;
}
myElem.onlick = doSomething; // This is the event for a single click. Works well.
myElem.ondblclick = doNothing; // The event handler is called, but the text is already highlighted.

具体问题：

1(我所追求的与双击事件有任何关系吗？(正如我看到触发警报时文本已经突出显示的那样，我怀疑这可能是另一种机制。我怀疑(单击(事件的默认行为可能与此有关，但我也取消了(单击(事件的默认行为。

2(如果它与dblclick事件无关，那么它与那有什么关系？我该如何预防？

3(如果是关于dblclick事件，我做错了什么吗？(顺便说一句，我想使用所有preventDefault()和cancelBubble = true和stopPropagation()和return false是矫枉过正。为了防止默认行为，我需要最少的代码是多少？

4(任何其他想法如何获得所需的结果(双击不选择并突出显示文本(？

我正在使用FF 11进行测试(但最终需要一个跨浏览器解决方案(。

谢谢！

myElem.onmousedown = function(e) {
    e.preventDefault()
}

编辑：将其从返回 fasle 更改为 e.preventDefault，这仍将允许触发点击事件。

有同样的问题，我立即在 dblclick 处理程序中添加了 event.preventDefault((，但它没有帮助。我没有考虑到的是事件冒泡以及默认行为在父元素中触发之前在子元素中触发的事实。

如果父级有多个孩子，您仍然需要在其中选择文本，但不希望在双击时进行选择，有 2 个选项：

  1. 清除父级事件处理程序中的选择，例如：window.getSelection((.empty((.这种方法的问题在于，您会注意到所选文本闪烁，并且在Opera中会出现一个弹出窗口("复制"，"搜索"(。
  2. 遍历所有子项，并在它们的 dblclick 中调用 e.PreventDefault((。
相关文章：