Иногда нужно запретить выделение текста в некоторых блоках - например при динамическом изменении размера, текст блока будет выделяться, что не есть красиво.
Решений тут два: используем jQuery либо CSS.
jQuery:
$(".classname").attr('unselectable','on').css('MozUserSelect','none');
CSS:
.classname{
-moz-user-select: none;
-khtml-user-select: none;
-webkit-user-select: none;
-o-user-select: none;
user-select: none;
}
Учитывая пожелания высказанные в комментариях, привожу пример яваскриптового отключения выделения (организованного в плагин), с явным отключением самого ивента 'onselectstart', а также содержащий весь уже выше перечисленный функционал:
jQuery.fn.extend({
disableSelection : function() {
this.each(function() {
this.onselectstart = function() { return false; };
this.unselectable = "on";
jQuery(this).css({
'-moz-user-select': 'none',
'-khtml-user-select': 'none',
'-webkit-user-select': 'none',
'-o-user-select': 'none',
'user-select': 'none'
});
});
},
enableSelection : function() {
this.each(function() {
this.onselectstart = function() {};
this.unselectable = "off";
jQuery(this).css({
'-moz-user-select': 'auto',
'-khtml-user-select': 'auto',
'-webkit-user-select': 'auto',
'-o-user-select': 'auto',
'user-select': 'auto'
});
});
}
});
// Example:
var selector = "td, span, div";
$(selector).disableSelection(); // disable
....
$(selector).enableSelection(); // enable