Очистить выбор текста с помощью JavaScript
Простой вопрос, на который я не могу найти ответ: как я могу использовать JavaScript (или jQuery), чтобы отменить выбор любого текста, который может быть выбран на веб-странице? НАПРИМЕР. пользователь щелкает и перетаскивает, чтобы выделить немного текста. Я хочу, чтобы функция deselectAll() удаляла этот выбор. Как мне его написать?
Спасибо за помощь.
Ответы
Ответ 1
if (window.getSelection) {
if (window.getSelection().empty) { // Chrome
window.getSelection().empty();
} else if (window.getSelection().removeAllRanges) { // Firefox
window.getSelection().removeAllRanges();
}
} else if (document.selection) { // IE?
document.selection.empty();
}
Кредит г-ну Y.
Ответ 2
Лучше всего проверить те функции, которые вы хотите напрямую:
var sel = window.getSelection ? window.getSelection() : document.selection;
if (sel) {
if (sel.removeAllRanges) {
sel.removeAllRanges();
} else if (sel.empty) {
sel.empty();
}
}
Ответ 3
Состояние дел по отбору 2014
Я сделал собственное исследование. Здесь функция, которую я написал и использую в эти дни:
(function deselect(){
var selection = ('getSelection' in window)
? window.getSelection()
: ('selection' in document)
? document.selection
: null;
if ('removeAllRanges' in selection) selection.removeAllRanges();
else if ('empty' in selection) selection.empty();
})();
В принципе, getSelection().removeAllRanges()
в настоящее время поддерживается всеми современными браузерами (включая IE9 +). Это, безусловно, правильный метод продвижения вперед.
Проблемы с совместимостью:
- В старых версиях Chrome и Safari используется
getSelection().empty()
- IE8 и ниже используется
document.selection.empty()
Update
Вероятно, неплохо завершить эту функцию выбора для повторного использования.
function ScSelection(){
var sel=this;
var selection = sel.selection =
'getSelection' in window
? window.getSelection()
: 'selection' in document
? document.selection
: null;
sel.deselect = function(){
if ('removeAllRanges' in selection) selection.removeAllRanges();
else if ('empty' in selection) selection.empty();
return sel; // chainable :)
};
sel.getParentElement = function(){
if ('anchorNode' in selection) return selection.anchorNode.parentElement;
else return selection.createRange().parentElement();
};
}
// use it
var sel = new ScSelection;
var $parentSection = $(sel.getParentElement()).closest('section');
sel.deselect();
Я создал эту вики сообщества, чтобы вы могли добавлять в нее функциональность или обновлять вещи по мере развития стандартов.
Ответ 4
Здесь принят ответ, но в двух строках кода:
var selection = window.getSelection ? window.getSelection() : document.selection ? document.selection : null;
if(!!selection) selection.empty ? selection.empty() : selection.removeAllRanges();
Единственная проверка, которую я не делаю, заключается в существовании removeAllRanges - но AFAIK не имеет браузера, который имеет либо window.getSelection
, либо document.selection
, но не имеет ни .empty
, ни .removeAllRanges
для этого свойство.
Ответ 5
window.getSelection() позволяет вам получить доступ к выделенному тексту, оттуда, несколько вещей, которые вы можете сделать, чтобы манипулировать им.
Подробнее: Разработчик Mozilla DOM Selection