javascript - 如何防止在 chrome 和 safari 中从 "empty"位置双击选择

Question

我的网页出现问题。当用户双击任何地方的空白区域(chrome/safari)时，它只需选择所有空白区域并突出显示。为了避免这种情况，我使用了这个 css 属性:

body {
  overflow: hidden;
  -moz-user-select     : none;
 -khtml-user-select   : none;
 -webkit-user-select  : none;
 -o-user-select       : none;
 user-select          : none;
}

现在我也无法选择“文本”。这真是太糟了。如何让可选择的变成可选择的并避免空白空间..？

有什么想法吗？

屏幕截图:

Live Demo

注意:点击表格列。您无法选择文本。

Answer 1

要防止双击空白区域，您可以使用以下脚本和样式。

function clearSelection() {
    if(document.selection && document.selection.empty) {
        document.selection.empty();
    } else if(window.getSelection) {
        var sel = window.getSelection();
        sel.removeAllRanges();
    }
}

对于 Chrome 和 safari 浏览器，您可以使用以下样式。

 span.no_selection {    
   -webkit-user-select: none; /*(safari, chrome) webkit */
 }

我希望它能正常工作。