в firefox и chrome window.getSelection используется для получения текущего выделения в документе, но текущий выбор находится в текстовом поле, window.getSelection не вернул выделение, а сам textarea. Итак, как правильно выбрать в firefox и chrome?
Window.getSelection получить правильный выбор в textarea
Ответ 1
Вам нужно получить выделенный текст в текстовом поле? Возможно, вы запрашиваете selectStart и selectionEnd (не существует в Internet Explorer, работает с Firefox и Chrome)
Select some text below and then click the button:<br/>
<textarea id="myTextarea" rows="5" cols="30">
Lorem ipsum dolor sit amet,
consectetur adipiscing elit.
</textarea>
<button onclick="alert(getTextSelection())">alert text selection</button>
<script type="text/javascript">
function getTextSelection(){
var field = document.getElementById("myTextarea");
var startPos = field.selectionStart;
var endPos = field.selectionEnd;
var field_value = field.value;
var selectedText = field_value.substring(startPos,endPos);
return selectedText;
}
</script>
Если есть несколько текстовых полей, и вы хотите получить вывод на выбор:
Select some text in either textarea:<br/>
<textarea rows="5" cols="30" onselect="alert(getTextSelection(this))">
Lorem ipsum dolor sit amet,
consectetur adipiscing elit.
</textarea>
<textarea rows="5" cols="30" onselect="alert(getTextSelection(this))">
fate it seems
not without a sense of irony
</textarea>
<script type="text/javascript">
function getTextSelection(field){
var startPos = field.selectionStart;
var endPos = field.selectionEnd;
var selectedText = field.value.substring(startPos,endPos);
return selectedText;
}
</script>
Или вы все еще можете сделать это с помощью кнопки, но используя глобальную переменную:
Select some text in either textarea and click the button:<br/>
<textarea rows="5" cols="30" onselect="window.selectedTextarea=this">
Lorem ipsum dolor sit amet,
consectetur adipiscing elit.
</textarea>
<textarea rows="5" cols="30" onselect="window.selectedTextarea=this">
fate it seems
not without a sense of irony
</textarea>
<button onclick="alert(getTextSelection())">alert text selection</button>
<script type="text/javascript">
// warning: global variable: dirty!!!
var selectedTextarea
function getTextSelection(){
var field = window.selectedTextarea;
var startPos = field.selectionStart;
var endPos = field.selectionEnd;
var selectedText = field.value.substring(startPos,endPos);
return selectedText;
}
</script>
Ответ 2
Текстовые поля и текстовые входы имеют API-интерфейс разностного выбора. Они имеют свойства selectionStart
и selectionEnd
, которые являются смещениями символов в свойстве value
для textarea/input. Эти свойства были стандартизованы в HTML5 и реализованы текущими версиями всех основных браузеров, хотя IE < 9 снова имеет другой API.