我喜欢Hybrid CSS + jQuery 解决方案。

要使 <div class="draggable"></div> 中的所有元素不可选择,请使用此 CSS:

.draggable {
    -webkit-user-select: none;
     -khtml-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
         -o-user-select: none;
            user-select: none;
}

.draggable input {
    -webkit-user-select: text;
     -khtml-user-select: text;
       -moz-user-select: text;
         -o-user-select: text;
            user-select: text;
 }

然后,如果您正在使用 jQuery,请将其添加到 $(文件)。ready() 区块中:

if (($.browser.msie && $.browser.version < 10) || $.browser.opera) $('.draggable').find(':not(input)').attr('unselectable', 'on');

我猜你仍然想要任何输入元素是互动的,因此 :not() pseudo-selector. 你可以使用“*”而不是如果你不在乎。

Caveat: Internet Explorer 9 可能不需要此额外的 jQuery 件,所以您可能想在那里添加一个版本检查。

.hidden:after { 内容: attr(data-txt); } <p class="hidden" data-txt="某些文本你不想被选中"></p>

然而,这不是最好的方式。

对于 Internet Explorer 此外,您还需要添加 pseudo class focus (.ClassName:focus) 和 outline-style: none。

.ClassName,
.ClassName:focus {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    outline-style: none; /* Internet Explorer  */
}

这在某些浏览器中工作:

::selection{ background-color: transparent;}
::moz-selection{ background-color: transparent;}
::webkit-selection{ background-color: transparent;}

简单地将您所需的元素/ID 添加到由无空间的 commas 分开的选择器前面,如下:

h1::selection,h2::selection,h3::selection,p::selection{ background-color: transparent;}
h1::moz-selection,h2::moz-selection,h3::moz-selection,p::moz-selection{ background-color: transparent;}
h1::webkit-selection,h2::webkit-selection,h3::webkit-selection,p::webkit-selection{ background-color: transparent;}

其他答案是更好的;这可能应该被视为最后的避难所 / 冲突。

::selection {background: transparent; color: transparent;}

::-moz-selection {background: transparent; color: transparent;}

它很容易用:

-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;

替代:

假设你有一个 <h1 id="example">Hello, World!</h1>. 你将不得不删除内部HTML的 h1,在这种情况下Hello, World. 然后你将不得不去CSS并这样做:

#example::before // You can of course use **::after** as well.
{
    content: 'Hello, World!'; // Both single-quotes and double-quotes can be used here.

    display: block; // To make sure it works fine in every browser.
}

现在它只是认为它是一个区块元素,而不是文本。