Получить выделенный текст из текстового поля

Получить выделенный текст из текстового поля

У текстовых полей (textarea, input text и т.д.) есть JS-свойства selectionStart и selectionEnd, которые возвращают начальную и последнюю позицию выделенного текста, начиная с нуля. Если текст не выделен, то эти значения совпадают.

Получим выделенный текст из textarea с использованием JQuery.

<textarea id="control">
	...
</textarea>

<a id="button" href="#">Получить выделенный текст</a>
HTML
$('#button').click(function(){
	var control = $('#control')[0];
	var text = $(control).val();
	if (control.selectionStart != control.selectionEnd) {
		val = text.substring(control.selectionStart, control.selectionEnd);
		alert(val);
	}
	return false;
});
JS

Ещё один пример – выделенный текст захватывается по событию mouseup у <textarea>.

<textarea id="control">
	...
</textarea>

<p id="result">Выделенный текст: <span></p>
HTML
$('#control').mouseup(function(){
	var text = $(this).val();
	if (this.selectionStart != this.selectionEnd) {
		val = text.substring(this.selectionStart, this.selectionEnd);
		$('#result span').text(val);
	}
});
JS
08.11.2019
6932

Комментарии

, чтобы добавить комментарий.

Другие публикации

CSS стили выделенного текста
::selection или ::-moz-selection – псевдоэлемент, который отвечает за стили выделяемой области текста.
7479
0
Как запретить выделение текста на сайте через CSS
Выделение текста в меню, кнопках и других элементах управления лучше запретить т.к. при нескольких кликах он выделяется...
31950
-1
Как выделить фразы в тексте
Сделать информативнее страницу поиска – это выделить искомую фразу в результатах...
6037
+5
Выделение ячеек таблицы по клику
В продолжении статей о рамках у ячеек таблицы, сделаем их появление по клику с помощью JQuery.
17367
+4
Contenteditable – текстовый редактор
Если добавить атрибут contenteditable к элементу, его содержимое становится доступно для редактирования пользователю, а...
47966
+35
Работа с Textarea jQuery
Сборник jQuery приемов с textarea - получить содержимое, вставить значение, подсчет количества символов и строк и т.д.
55854
+4