Форум

xbit · #1 (**permalink**) 31.12.2016, 05:40

Всем добрый день и с Наступающим Новым Годом!

Просьба помочь с решением.

Есть текстареа. Мне нужно, по событию (нажатие кнопки) получить объект, где будет три элемента, содержащие: выделенный текст, текст до выделения, текст после выделения. при этом текст до и после нужно из оригинального текстареа удалить.

Буду благодарен за ответы и, особенно, если поделитесь какими-нибудь еще черновыми функциями/наработками для подобных дел. Раньше с текстом не работал, своего ничего нет.

Спасибо.

Malleys · #2 (**permalink**) 31.12.2016, 09:24

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<title>Document</title>
		<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, minimal-ui">
	</head>
	<body>
		<textarea id="test" cols="30" rows="10">Привет!!! У textarea есть свойства selectionStart/selectionEnd, которые позволяют узнать позицию выделенного текста!</textarea><br>
		<button onclick="getParts(); ">Выдели часть текста и нажми</button>
		<div id="result"></div>
		<script>

	function getParts() {
		var textarea = document.getElementById("test");
		var resultElement = document.getElementById("result");
		var html = [];

		html.push("Выделены символы: ".bold() + textarea.selectionStart + "\u2026" + textarea.selectionEnd);

		html.push("Текст до выделения: ".bold() + textarea.value.slice(0, textarea.selectionStart));

		html.push("Выделенный текст: ".bold() + textarea.value.slice(textarea.selectionStart, textarea.selectionEnd));

		html.push("Текст после: ".bold() + textarea.value.slice(textarea.selectionEnd));

		textarea.value = "Было выделено: " + textarea.value.slice(textarea.selectionStart, textarea.selectionEnd);


		resultElement.innerHTML = html.join("<hr>")

	}

		</script>
	</body>
</html>

xbit · #3 (**permalink**) 31.12.2016, 10:21

Спасибо!

Форум

Справочник

Discord чат

Курсы javascript