Получение выделенного текста в браузере, кросс-платформенный

Question

Одна из вещей, которые я хотел бы сделать в своем браузерном приложении, - позволить пользователю выбрать некоторый текст (не в , просто обычный текст!), И чтобы мое приложение всплыло небольшая панель инструментов, которая затем может взаимодействовать со следующей (в моем случае, добавить аннотации).

Я нашел много вещей в Google, которые, кажется, сосредоточены на написании WYSIWYG-редакторов, , но это не то, чего я хочу , и большая часть этого работала в IE, но не в FF2 или 3. В идеале я хотел бы, чтобы какая-то функция могла возвращать текущий выбранный текст в окне браузера, который работает в IE7 (и 6, если возможно), FireFox 2 & 3 и Safari 2 . Если это работает в Opera, это будет бонусом, но это не обязательно.

У кого-нибудь есть функция, которая делает это? Или идея с чего начать?

Answer 1

Этот плагин jQuery - это круто, но он выполняет очень специфическую задачу: заключите выделенный текст в тег. Это может быть именно то, что вы хотите. Но если вы не хотите (или не можете) добавить какую-либо постороннюю разметку на свою страницу, вместо этого вы можете попробовать следующее решение:

function getSelectedText() {
  var txt = '';

  if (window.getSelection) {
    txt = window.getSelection();
  }
  else if (document.getSelection) {
    txt = document.getSelection();
  }
  else if (document.selection) {
    txt = document.selection.createRange().text;
  }
  else return; 

  return txt;
}

Эта функция возвращает объект, представляющий выделенный текст. Он работает во всех браузерах (хотя я подозреваю, что возвращаемые объекты будут немного отличаться в зависимости от браузера и зависят только от фактического текста результата, а не от каких-либо дополнительных свойств).

Примечание: я первоначально обнаружил этот фрагмент кода здесь: http://www.codetoad.com/javascript_get_selected_text.asp

Answer 2

Взгляните на jQuery и плагин wrapSelection . Это может быть то, что вы ищете.

Answer 3

Введение в диапазон содержит некоторые сведения о том, как разные браузеры предоставляют вам доступ к выделенному тексту.

Мой опыт показывает, что работать с этими различными API-интерфейсами напрямую довольно неуклюже, поэтому, если wrapSelection работает для вас, я пойду с этим.

Answer 4

В наши дни этого метода должно хватить :

function getSelectedText() {
    return window.getSelection ? window.getSelection().toString() : '';
}

Он вернет '' в редких случаях действительно старых браузеров и может быть в случае Opera Mini (хотя и может быть проверено, но это может быть устаревшим) + см. Примечание для UC Browser для Android.

Answer 5

Этот код работает в Safari, IE и Firefox - надеюсь, он поможет

var str = (window.getSelection) ? window.getSelection() : document.selection.createRange();
str = str.text || str;
str = str + ''; // the best way to make object a string...

Answer 6

Поведение отдельных браузеров в отношении выбора обозначено здесь .