Друзья, имеется такой пользовательский интерфейс.
<textarea>
- туда юзер заносит текст, который отображается в <div class="text">
<select id="part">
- цвет текста частично - позволяет, чтобы юзер выделил часть текста <div class="text">
и установил цвет - метод createElement("span")
Однако, если в textarea юзер внесет изменения, createElement("span")
сбрасывается, с точки зрения юзера - цвет всего текста снова становится черным (по умолчанию)
Что можно сделать для сохранения createElement("span")
Заранее спасибо.
$("#part").change(function () {
var selectedText = window.getSelection ? window.getSelection() : document.selection.createRange();
if (selectedText.getRangeAt) {
var range = selectedText.getRangeAt(0);
var newNode = document.createElement("span");
if ($(this).val() == 1) {
newNode.setAttribute('class', 'highlightedTextRed');
}
else if ($(this).val() == 2) {
newNode.setAttribute('class', 'highlightedTextBlue');}
else {
newNode.setAttribute('class', 'highlightedTextWhite');}
range.surroundContents(newNode);
}
});
div
с атрибутомcontenteditable
.