在 IE 中使事物无法选择答案

【问题标题】：Making things unselectable in IE在 IE 中使事物无法选择
【发布时间】：2011-05-25 19:43:50
【问题描述】：

这是我用 JS 写的图表：

CSS：

-moz-user-select:none;
-khtml-user-select: none;

适用于 Chrome/FF，但在 IE 中，所有元素仍然可以选择，这在拖动栏时看起来很奇怪。

如何在 IE 中使其无法选择？

【问题讨论】：

要让 fiddle 工作，它需要设置为 Nowrap (body) 和 No Library (纯 JS)

标签： javascript cross-browser selectable

【解决方案1】：

在 IE 中，您需要 HTML 中的unselectable 属性：

<div id="foo" unselectable="on">...</div>

... 或通过 JavaScript 设置：

document.getElementById("foo").setAttribute("unselectable", "on");

需要注意的是，不可选择性不会被不可选择元素的子元素继承。这意味着您要么必须在 <div> 内每个元素的开始标记中放置一个属性，要么使用 JavaScript 为元素的后代递归地执行此操作：

function makeUnselectable(node) {
    if (node.nodeType == 1) {
        node.setAttribute("unselectable", "on");
    }
    var child = node.firstChild;
    while (child) {
        makeUnselectable(child);
        child = child.nextSibling;
    }
}

makeUnselectable(document.getElementById("foo"));

【讨论】：

好东西！而在 jquery 中： $('#foo').attr("unselectable", "on");

【解决方案2】：

您可以使用 Javascript 使文本在所有浏览器中都无法选择：

document.onselectstart=new Function('return false');
function noselect(e){return false;}
function click(){return true;}
document.onmousedown=noselect;
document.onclick=click;

在这个 SO 线程中描述了另一种方式：Is there a way to make text unselectable on an HTML page?

最便宜的方式大概是<body onselectstart="return false">

最好的方法可能是使用以下 CSS：

[unselectable=on] { -moz-user-select: none; -khtml-user-select: none; user-select: none; }

并将IE unselectable property 添加到要使其不可选择的元素（HTML 中的unselectable="on"；javascript 中的element.setAttribute("unselectable","on")）

看看这个不错的small article about unselectable text。

【讨论】：

在较新版本的IE中没有尝试过，但是是在MSDN中指定的，可能是贬值了。

【解决方案3】：

有一个unselectable="on" 属性。

http://msdn.microsoft.com/en-us/library/ms537840%28VS.85%29.aspx

【讨论】：

【解决方案4】：

到目前为止，这似乎在 Chrome 和 IE11 中运行良好，使用 JQuery...

function fMakeNodeUnselectable(node){      
    $(node).css({"cursor":"default","-moz-user-select":"-moz-none","-khtml-user-select":"none","-webkit-user-select":"none","-o-user-select":"none","user-select":"none"});
    $(node).attr("unselectable","on");
}

【讨论】：

问题是针对 IE 的。您的解决方案是 Chrome？