Извлечение текста из div contentEditable

У меня есть div, установленный в contentEditable и стилизованный с " white-space: pre ", поэтому он сохраняет такие вещи, как разрывы строк. В Safari, FF и IE div выглядит и работает одинаково. Все хорошо. Что я хочу сделать, это извлечь текст из этого div, но таким образом, чтобы не потерять форматирование, в частности, разрывы строк.

Мы используем jQuery, чья text () Функция в основном выполняет предварительный заказ DFS и склеивает все содержимое в этой ветви DOM в один кусок. Это теряет форматирование.

Я посмотрел на функцию html () , но кажется, что все три браузера делают разные вещи с реальным HTML, который генерируется за кулисами в моем contentEditable div. Предполагая, что я ввожу это в свой div:

1
2
3

Вот результаты:

Safari 4:

1
<div>2</div>
<div>3</div>

Firefox 3.6:

1
<br _moz_dirty="">
2
<br _moz_dirty="">
3
<br _moz_dirty="">
<br _moz_dirty="" type="_moz">

IE 8:

<P>1</P><P>2</P><P>3</P>

Тьфу. Ничего особенного здесь нет. Удивительно то, что MSIE выглядит самым вменяемым!

var extractedText = extractTextWithWhitespace($(this));
var $someXmlNode = $('<someXmlNode/>');
$someXmlNode.text(extractedText);

Получающийся в результате XML в конечном итоге отправляется на сервер с помощью вызова AJAX.

Это хорошо работает в Safari и Firefox.

В IE только первый '\ n', похоже, каким-то образом сохраняется. Более подробно, похоже, что jQuery устанавливает текст следующим образом (строка 4004 из jQuery-1.4.2.js):

return this.empty().append( (this[0] && this[0].ownerDocument || document).createTextNode( text ) );

Читая в createTextNode , кажется, что реализация IE может помешать пробел. Это правда или я что-то не так делаю?

46
задан Shaggy Frog 11 August 2010 в 20:54
поделиться