Запрет выделения текста
Запрет выделения текста с помощью JavaScript
Запрет выделения текста мышью
Если быть точным, то это не запрет, а сброс выделения, если на странице что-то выделили мышкой.
Для этого добавляем в тег BODY вызов функции при отпускатии кнопки мыши:
Для этого добавляем в тег BODY вызов функции при отпускатии кнопки мыши:
<body onmouseup="noSelect(event);">
Сама функция выглядит так:
function noSelect(e){
target=e.target||window.event.srcElement;
/*
в полях формы INPUT и TEXTAREA выделять можно,
в остальных местах нет
*/
if(target.tagName!='INPUT' && target.tagName!='TEXTAREA'){
//для FireFox, Chrome, Opera, Safari
if(window.getSelection){
window.getSelection().removeAllRanges();
}
//для IE, используем объект selection
else
document.selection.empty();
}
}
Пример:
Попробуйте выделить текст в блоке ниже
В этом блоке стоит запрет на выделение текста с помощью JavaScript для браузеров FireFox, Chrome, Safari, Opera, Internet Explorer.
Запрет выделения текста при нажатии клавиш Cnrl+A
Добавляем в тег BODY вызов функции при нажатии и отпускании клавиш:
<body onkeydown="noSelectCtrlA(event);" onkeyup="noSelectCtrlA(event);" >
Сама функция выглядит так:
function noSelectCtrlA(){
var e=event || window.event;
var target=e.target || e.srcElement;
/*
в полях формы INPUT и TEXTAREA выделять можно,
в остальных местах нет
*/
if(target.tagName=='INPUT' && target.tagName=='TEXTAREA') return;
var key=e.keyCode || e.which;
//'A'.charCodeAt(0) можно заменить на 65
if(e.ctrlKey && key=='A'.charCodeAt(0)){
//вызываем функцию сброса выделения, описанную выше
noSelect(e)
//отменяем событие
if(e.preventDefault)
e.preventDefault();
else
e.returnValue = false;
}
}
Примечание:
В Opera длительное (2–3 секунды) удержание данной комбинации вызывает выделение текста до ее отпускания. Причем, если сначала отпустить клавишу А, а потом Ctrl, то выделение пропадает. Если отпустить одновременно — остается.
Safari не обрабатывает событие keydown для клавиш при зажатом Ctrl. Потому выделение текста пропадает только после отпускания клавиш.
Запрет выделения текста с помощью CSS
Запретить выделять текст с помощью CSS (каскадные таблицы стилей) можно в FireFox, Chrome и Safari.
В FF для этого используется свойство -moz-user-select
-moz-user-select: none; - выделение запрещено
-moz-user-select: text; - выделение разрешено
В Chrome и Safari — свойсво -webkit-user-select
-webkit-user-select: none; - выделение запрещено
-webkit-user-select: text; - выделение разрешено
Пример:
Попробуйте выделить текст в блоке ниже (работает в FireFox, Chrome, Safari)
В этом блоке стоит запрет на выделение текста с помощью CSS для браузеров FireFox, Chrome, Safari.