如何禁用文本select使用jQuery？
jQuery或jQuery-UI是否具有禁用给定文档元素的文本select的function？
在jQuery 1.8中，可以这样做：
(function($){ $.fn.disableSelection = function() { return this .attr('unselectable', 'on') .css('user-select', 'none') .on('selectstart', false); }; })(jQuery); 如果你使用jQuery UI，有一个方法，但它只能处理鼠标select（即CTRL + A仍在工作）：
$('.your-element').disableSelection(); // deprecated in jQuery UI 1.9
该代码非常简单，如果你不想使用jQuery UI：
$(el).attr('unselectable','on') .css({'-moz-user-select':'-moz-none', '-moz-user-select':'none', '-o-user-select':'none', '-khtml-user-select':'none', /* you could also put this in a class */ '-webkit-user-select':'none',/* and add the CSS class here instead */ '-ms-user-select':'none', 'user-select':'none' }).bind('selectstart', function(){ return false; });
我发现这个答案（ 防止文本列表突出显示 ）最有帮助，也许它可以与提供IE兼容性的另一种方式相结合。
#yourTable { -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; user-select: none; }
这里有一个更全面的解决scheme来select断开连接，并取消一些热键（如Ctrl + a和Ctrl + c。Test ： Cmd + a和Cmd + c ）
(function($){ $.fn.ctrlCmd = function(key) { var allowDefault = true; if (!$.isArray(key)) { key = [key]; } return this.keydown(function(e) { for (var i = 0, l = key.length; i < l; i++) { if(e.keyCode === key[i].toUpperCase().charCodeAt(0) && e.metaKey) { allowDefault = false; } }; return allowDefault; }); }; $.fn.disableSelection = function() { this.ctrlCmd(['a', 'c']); return this.attr('unselectable', 'on') .css({'-moz-user-select':'-moz-none', '-moz-user-select':'none', '-o-user-select':'none', '-khtml-user-select':'none', '-webkit-user-select':'none', '-ms-user-select':'none', 'user-select':'none'}) .bind('selectstart', false); }; })(jQuery);
并举例说明：
$(':not(input,select,textarea)').disableSelection();
jsfiddle.net/JBxnQ/
对于老版本的FireFox来说，这也是不够的（我不知道是哪一个）。 如果所有这些都不起作用，请添加以下内容：
.on('mousedown', false)
以下将禁用所有常见浏览器（IE，Chrome，Mozilla，Opera和Safari）中所有类的“项目”的select：
$(".item") .attr('unselectable', 'on') .css({ 'user-select': 'none', 'MozUserSelect': 'none' }) .on('selectstart', false) .on('mousedown', false);
$(document).ready(function(){ $("body").css("-webkit-user-select","none"); $("body").css("-moz-user-select","none"); $("body").css("-ms-user-select","none"); $("body").css("-o-user-select","none"); $("body").css("user-select","none"); });
这可以很容易地使用JavaScript这是适用于所有浏览器
<script type="text/javascript"> /*********************************************** * Disable Text Selection script- © Dynamic Drive DHTML code library (www.dynamicdrive.com) * This notice MUST stay intact for legal use * Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code ***********************************************/ function disableSelection(target){ if (typeof target.onselectstart!="undefined") //For IE target.onselectstart=function(){return false} else if (typeof target.style.MozUserSelect!="undefined") //For Firefox target.style.MozUserSelect="none" else //All other route (For Opera) target.onmousedown=function(){return false} target.style.cursor = "default" } </script>
调用这个函数
<script type="text/javascript"> disableSelection(document.body) </script>
这其实很简单。 要禁用文本select（也可以单击+拖动文本（例如Chrome中的链接）），只需使用以下jQuery代码：
$('body, html').mousedown(function(event) { event.preventDefault(); });
所有这一切都可以防止在您使用鼠标（ mousedown() ）在body和html标签中单击时发生默认设置。 通过改变两个引号之间的文本（例如，将$('body, html')更改$('#myUnselectableDiv') ，可以非常容易地更改元素，使myUnselectableDiv div可以不可选。
一个快速的片段显示/certificate给你：
$('#no-select').mousedown(function(event) { event.preventDefault(); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <span id="no-select">I bet you can't select this text, or drag <a href="#">this link</a>, </span> <br/><span>but that you can select this text, and drag <a href="#">this link</a>!</span>
CHROME的1线解决scheme：
body.style.webkitUserSelect = "none";
和FF：
body.style.MozUserSelect = "none";
IE需要设置“不可选”属性（详见底部）。
我在Chrome中testing了它，它工作。 这个属性是inheritance的，所以在body元素上设置它会禁用整个文档中的select。
详情请见： http : //help.dottoro.com/ljrlukea.php
如果你使用Closure，只需调用这个函数：
goog.style.setUnselectable(myElement, true);
它透明地处理所有的浏览器。
非IE浏览器是这样处理的：
goog.style.unselectableStyle_ = goog.userAgent.GECKO ? 'MozUserSelect' : goog.userAgent.WEBKIT ? 'WebkitUserSelect' : null;
这里定义： http : //closure-library.googlecode.com/svn/! svn/ bc/4/trunk/ closure/ goog/ docs/ closure_goog_style_style.js.source.html
IE部分是这样处理的：
if (goog.userAgent.IE || goog.userAgent.OPERA) { // Toggle the 'unselectable' attribute on the element and its descendants. var value = unselectable ? 'on' : ''; el.setAttribute('unselectable', value); if (descendants) { for (var i = 0, descendant; descendant = descendants[i]; i++) { descendant.setAttribute('unselectable', value); } }
我认为这个代码适用于所有的浏览器，并且需要最less的开销。 这真是上述所有答案的混合体。 让我知道如果你发现一个错误！
添加CSS：
.no_select { user-select: none; -o-user-select: none; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; -ms-user-select:none;}
添加jQuery：
(function($){ $.fn.disableSelection = function() { $(this).addClass('no_select'); if($.browser.msie) { $(this).attr('unselectable', 'on').on('selectstart', false); } return this; }; })(jQuery);
可选：要禁止所有子元素的select，您可以将IE块更改为：
$(this).each(function() { $(this).attr('unselectable','on') .bind('selectstart',function(){ return false; }); });
用法：
$('.someclasshere').disableSelection();
对于这种情况的一个解决scheme是，对于不希望被select的文本使用<button> 。 如果您绑定到某个文本块上的click事件，并且不希望该文本是可选的，那么将其更改为button将改善语义并防止文本被选中。
<button>Text Here</button>
最好和最简单的方式，我发现它，防止CTRL + C，右键单击。 在这种情况下，我封锁了一切，所以我不必指定任何东西。
$(document).bind("contextmenu cut copy",function(e){ e.preventDefault(); //alert('Copying is not allowed'); });
