我正在HTML / CSS / JS中构建菜单，我需要一种方法来防止双击菜单时突出显示菜单中的文本。我需要一种将多个div的id传递给函数并在其中禁用突出显示的方法。

因此，当用户意外(或者故意)双击菜单时，菜单显示其子元素，但其文本不会突出显示。

Web上有很多脚本，但是很多似乎已经过时了。最好的方法是什么？

解决方案

你可以：

• 给它(" it"作为文本)一个onclick事件
• 第一次点击可将变量设置为当前时间
• 第二次单击检查以查看该变量是否为当前当前时间的x时间(因此，双击(例如500ms)不会注册为双击)。
• 如果是双击，请在页面上执行某些操作，例如添加隐藏的HTML，执行document.focus()。我们必须进行试验，因为其中一些可能会导致不必要的滚动。

希望这是我们想要的。

<script type="text/javascript">
function clearSelection() {
var sel ;
if(document.selection && document.selection.empty){
document.selection.empty() ;
} else if(window.getSelection) {
sel=window.getSelection();
if(sel && sel.removeAllRanges)
sel.removeAllRanges() ;
}
}
</script>

<div ondblclick="clearSelection()">Some text goes here.</div>

我们可以使用此CSS来隐藏选择颜色(IE不支持)：

#id::-moz-selection {
background: transparent;
} 

#id::selection {
background: transparent;
}

在(Mozilla，Firefox，Camino，Safari，Google Chrome)中，我们可以使用以下命令：

div.noSelect {
  -moz-user-select: none; /* mozilla browsers */
  -khtml-user-select: none; /* webkit browsers */
}

对于IE，没有CSS选项，但是我们可以捕获ondragstart事件，并返回false；否则，返回false。

更新

自2008年以来，此属性的浏览器支持已扩展。

div.noSelect {
  -webkit-user-select: none;  /* Chrome all / Safari all */
  -moz-user-select: none;     /* Firefox all */
  -ms-user-select: none;      /* IE 10+ */
}

https://css-tricks.com/almanac/properties/u/user-select/