Очистить выбор текста с помощью 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