jQuery - получить значение текстовой области, содержащей теги HTML

РЕДАКТИРОВАТЬ:

Использование $.text() работает, как и ожидалось, проблема возникла где-то еще. Я не буду удалять вопрос для дальнейшего использования, если кто-то столкнется, казалось бы, с той же проблемой. Пожалуйста, также ознакомьтесь с принятым ответом для решения.

Я разрабатываю редактор форматированного текста, который считывает содержимое из textarea и создает редактируемый div с использованием этого содержимого.

Проблема в том, что я не могу получить теги HTML из текстовой области, только обычный текст.

HTML-код

<textarea id="rtf-1">
    <h2>Big monster&nbsp;</h2><p>Kosova long crowing rooster test.</p>
</textarea>

Код JavaScript

var html = $('#rtf-1').html();

Не могу понять, почему, но var html всегда "Большой монстр Косова, тест на длинный крик петуха", теги убиваются где-то в процессе. То же самое происходит, когда я пытаюсь использовать $.text() или $.val().

Мне нужно, чтобы var html было <h2>Big monster&nbsp;</h2><p>Kosova long crowing rooster test.</p>. Любые советы о том, как это можно сделать?

Спасибо, что прочитали мой ответ. Я не ищу альтернативных способов инициализации редактора форматированного текста, кроме самого содержимого (значения) текстовой области, и я, конечно, не ищу уже существующие редакторы RTF, такие как TinyMCE. Если можете, ответьте на вопрос выше.


javascript html jquery richtext
person John Weisz    schedule 14.10.2014    source источник
comment
может быть, вместо этого использовать .text()? Он извлечет сам текст (теги и все остальное), а затем вы сможете .parseHTML() снова получить значения HTML. что-то вроде var html = $.parseHTML($('#rtf-1').text());   -  person PlantTheIdea    schedule 14.10.2014
comment
@PlantTheIdea, разве это не будет похоже на var domNodes = $.parseHTML(...)? $.parseHTML принимает строку HTML (в отличие от ее возврата).   -  person jmar777    schedule 14.10.2014
comment
Спасибо за помощь, как оказалось, код отлично работает с .text(), но проблема заключалась в связывании элементов textarea с соответствующими им div   -  person John Weisz    schedule 14.10.2014

Ответы (1)


arrow_upward
1
arrow_downward

Элементы textarea на самом деле не содержат HTML, поэтому, чтобы получить эквивалент строки, представляющей HTML, вы можете использовать .text(). Например.,

$('#render-to-me').html($('#rtf-1').text());

Вот JSFiddle для демонстрации: http://jsfiddle.net/44xjew92/

person jmar777    schedule 14.10.2014
comment
Спасибо за ответ, но, как оказалось, проблема возникает из-за связывания данного textarea с соответствующим ему div. - person John Weisz; 14.10.2014
comment
Что вы имеете в виду под ассоциацией там? - person jmar777; 14.10.2014
comment
div, созданному для редактирования форматированного текста, назначается сгенерированный, но уникальный идентификатор rtf-editor-#. Свойство data-rtf-editor textarea равно id этого нового div. Чтобы иметь возможность использовать текстовое поле в формах, обработчик событий rtfchange также привязан к новому div, который обновляет... ну, теперь связанное textarea содержимое. Эта ассоциация является источником проблемы. - person John Weisz; 14.10.2014