在IE中使事情无法选择

Tom*_*len 8 javascript cross-browser selectable

这是我用JS编写的图表:

http://jsfiddle.net/49FVb/

css:

-moz-user-select:none;
-khtml-user-select: none;
Run Code Online (Sandbox Code Playgroud)

适用于Chrome/FF,但在IE中,所有元素仍然是可选择的,当拖动周围的条形时看起来很奇怪.

如何在IE中使这个无法选择?

Tim*_*own 14

在IE中,您需要unselectableHTML中的属性:

<div id="foo" unselectable="on">...</div>
Run Code Online (Sandbox Code Playgroud)

...或通过JavaScript设置:

document.getElementById("foo").setAttribute("unselectable", "on");
Run Code Online (Sandbox Code Playgroud)

要注意的是,不可选择的元素并不是由不可选择的元素的孩子继承的.这意味着您必须将属性放在其中每个元素的开始标记中,<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"));
Run Code Online (Sandbox Code Playgroud)

  • 优秀的东西!在jquery中:$('#foo').attr("unselectable","on"); (2认同)

Den*_*s G 5

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

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

在这个SO线程中描述了另一种方式:有没有办法在HTML页面上使文本无法选择?

最便宜的方式可能是 <body onselectstart="return false">

最好的方法是使用以下CSS:

[unselectable=on] { -moz-user-select: none; -khtml-user-select: none; user-select: none; }
Run Code Online (Sandbox Code Playgroud)

并将IE unselectable属性添加到您想要取消选择的元素中(unselectable="on"在HTML中; element.setAttribute("unselectable","on")在javascript中)

看看这篇关于不可选文本的小文章.