How do I disable text selection with CSS or JavaScript?

Possible Duplicate:
CSS rule to disable text selection highlighting

I am making a HTML/CSS/jQuery gallery, with several pages.

I indeed have a "next" button, which is a simple link with a jQuery click listener.

The problem is that if the user click the button several times, the text of the button is selected, and then the full line of text. In my really darky design, that is really ugly and nonsensical.

So here is my question: Can you disable text selection on HTML? If not, I'll terribly miss flash and its high level of configuration on textfields...


<div 
 style="-moz-user-select: none; -webkit-user-select: none; -ms-user-select:none; user-select:none;-o-user-select:none;" 
 unselectable="on"
 onselectstart="return false;" 
 onmousedown="return false;">
    Blabla
</div>

UPDATE January, 2017:

According to Can I use, the user-select is currently supported in all browsers except Internet Explorer 9 and earlier versions (but sadly still needs a vendor prefix).


All of the correct CSS variations are:

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}
<p>
  Selectable text.
</p>
<p class="noselect">
  Unselectable text.
</p>

试试这个CSS代码以实现跨浏览器兼容性。

-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-o-user-select: none;
user-select: none;
链接地址: http://www.djcxy.com/p/1100.html

上一篇: 获取突出显示/选定的文本

下一篇: 如何禁用CSS或JavaScript的文字选择?