Как получить выделенный текст с помощью JavaScript

Question

Я немного запутался, почему этот код не работает!

Разметка HTML:

<div id="diva"><b>Score</b> some <i>goals</i></div>
<div id="soda"></div>

Код JavaScript:

function GetSelectedText () {
if (window.getSelection) {  // all browsers, except IE before version 9
    var range = window.getSelection ();
    alert (range.toString ());
} 
else {
    if (document.selection.createRange) { // Internet Explorer
        var range = document.selection.createRange ();
        alert (range.text);
    }
}
}

var butn = document.getElementById("soda");
butn.onclick = function(){
    GetSelectedText();
}

Answer 1

Одна проблема, с которой вы можете столкнуться, заключается в том, что в некоторых браузерах (особенно в IE) к тому времени click Событие пожаров, выбор был уничтожен. Вы можете исправить это с помощью mousedown событие вместо этого (которое все еще позволяет уничтожить выделение, но только после того, как событие было обработано), или сделать кнопку невыбираемой.

Я предполагаю, что ваша кнопка не является действительным кнопочным вводом, потому что это происходит только для обычных элементов.

Демо: http://jsfiddle.net/L9bvU/1/

Answer 2

function getSelectedText() {
    if (window.getSelection) {
        txt = window.getSelection();
    } else if (window.document.getSelection) {
        txt =window.document.getSelection();
    } else if (window.document.selection) {
        txt = window.document.selection.createRange().text;
    }
    return txt;  
}
<p onmouseup="getSelectedText(); alert(txt)">
Highlight some of this text
with the mouse select press button end release
to fire the event. </p>

Это мой путь. Вам просто нужно выбрать текст предупреждения о конце текста или что-нибудь еще.
Кто-нибудь знает, как OnMouse (событие) установить для всего документа в html, и его не нужно напрямую добавлять на html-страницу.
Чтобы быть на другой стороне, как мы можем изменить элементы в firebug!> -examples

Answer 3

Ну, есть две проблемы с приведенным выше кодом. Вы не можете быть уверены, что

var butn = document.getElementById("soda");

будет работать, потому что он может быть выполнен до загрузки документа

-При нажатии на другой элемент, который не является кнопкой, выбор теряется. Если вы измените div "soda" на, то он будет работать:

<div id="diva"><b>Score</b> some <i>goals</i></div>
<div id="soda" onclick="GetSelectedText()">This will NOT work</div>
<input type="button" onclick="GetSelectedText()" value="This will work"/>

Однако я настоятельно рекомендую вам взглянуть на jQuery, как посоветовали другие; это сделает вашу жизнь намного проще!