Шрифт выделенного текста меняется на определённый цвет

@melnikov24 · Регистрация: 24.08.2018

Author24 — интернет-сервис помощи студентам

Есть кнопки у каждый в значении свой цвет
есть образец текста
как должно работать:
1.выделяем часть текста
2.нажимаем кнопку с определённым цветом к примеру красный
3. и текст который мы выделили становится красным

@amr-now · 25.10.2018, 22:29

PHP/HTML

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
</head>
<body>
    <div id="colors">
        <div><input type="button" name="color" value="red" style="width:100px" /></div>
        <div><input type="button" name="color" value="blue" style="width:100px" /></div>
        <div><input type="button" name="color" value="green" style="width:100px" /></div>
        <div><input type="button" name="color" value="yellow" style="width:100px" /></div>
    </div>
    <div id="out">Образец очень длинного текста</div>
    <script>
        function handler() {
            document.getElementById("colors").onclick = (e) => {
                if (e.target.name == "color") {
                    let r = document.getSelection().getRangeAt(0);
                    let selectionContents = r.extractContents();
                    let el = document.createElement("span");
                    el.style.color = e.target.value;
                    el.appendChild(selectionContents);
                    r.insertNode(el);
                }
            };
        }
        window.addEventListener("DOMContentLoaded", handler);
    </script>
</body>
</html>

@melnikov24 0 / 0 / 0 Регистрация: 24.08.2018 Сообщений: 9
		1
	Шрифт выделенного текста меняется на определённый цвет 25.10.2018, 21:23. Показов 2089. Ответов 1 Метки нет (Все метки) Есть кнопки у каждый в значении свой цвет есть образец текста как должно работать: 1.выделяем часть текста 2.нажимаем кнопку с определённым цветом к примеру красный 3. и текст который мы выделили становится красным 0

	25.10.2018, 22:29

Шрифт выделенного текста меняется на определённый цвет

Решение