Получить отформатированный HTML из CKEditor

Question

Я использую CKEditor в своем веб-приложении, и я не знаю, как получить содержимое редактора с форматированием HTML.

var objEditor = CKEDITOR.instances["sectionTextArea"];
var q = objEditor.getData();

Это даст мне введенный текств CKEditor, без разметки.

Однако,

var q = objEditor.getHTML();

вернет нулевое значение.Что я делаю не так?

Answer 1

getHTML не является методом объекта CKEditor, поэтому вместо нуля у вас должна быть ошибка javascript.

Метод, определенный в API: getData () , если это не сработает, тогда у вас есть другая проблема в вашем коде, попробуйте использовать предупреждение для проверки содержимого в этот момент.

Answer 2

просто чтобы знать, что правильный метод для этого getData() не помог мне.Я не знал, как использовать его на объекте CKEditor.и CKEDITOR.getData() не работает.

это то, как getData() используется для объекта CKEDITOR:

CKEDITOR.instances.my_editor.getData()

... где my_editor - идентификатор вашего текстового поляиспользуется для CKEditor.

Противоположность этому setData():

CKEDITOR.instances.my_editor.setData("<p>My Text</p>");

Answer 3

Чтобы получить htmlData из редактора, вы должны использовать фрагмент кода ниже:

var htmldata = CKEDITOR.instances.Editor.document.getBody().getHtml();

Если это решение не будет работать, проверьте, не установлены ли у вас BBCode плагины.

Answer 4

Пожалуйста, обновите ckeditor config.js следующей строкой

config.fullPage = true;

Это вернет полный HTML, когда вы запросите getData ();

Answer 5

Это сработало для меня:

CKEDITOR.instances["id"].getData()

Answer 6

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

CKEDITOR.getFullHTMLContent = function(editor){
	var cnt = "";
	editor.once('contentPreview', function(e){
		cnt = e.data.dataValue;
		return false;
	});
	editor.execCommand('preview');
	
	return cnt;
}

Answer 7

Если у вас два CKEditor , вы можете использовать код ниже:

HTML

<textarea name="editor1"></textarea>
<textarea name="editor2"></textarea>

JS

CKEDITOR.replace( 'editor1' );
CKEDITOR.replace( 'editor2' );

var objEditor1 = CKEDITOR.instances["editor1"];
alert(objEditor1.getData()); // get html data

var objEditor2 = CKEDITOR.instances["editor2"];
alert(objEditor2.getData()); // get html data

Демонстрация онлайн (jsfiddle)

Answer 8

Попробуйте это:

CKEDITOR.instances.YOUREDITOR.element.getHtml();

с помощью CKEDITOR.instances.YOUREDITOR.element вы выбираете элемент DOM и, если вы используете CKEDITOR.instances.YOUREDITOR.element.getHtml (); Вы можете получить все HTML из редактора элемента.

Answer 9

Я понимаю, что это старый, но мне было трудно найти ответ, который имел смысл и возвращал фактический HTML, включая изображения. Если ваш экземпляр ckeditor присоединен к текстовой области, вы можете просто получить значение текстовой области, чтобы получить HTML.

Например, если вы используете jQuery:

$('#my_editor').val()

Не нужно копаться в API.

Answer 10

Для пользователей Java ...

После нажатия кнопки отправки запрос отправляется методом HTTP Post. Этот запрос Post также содержит отформатированный html в параметре, названном с использованием атрибута name текстовой области.

Итак, если ваша текстовая область - что-то вроде ...

<form method="post" action="createPDF.do"> <textarea name="editor1" id="editor1"/><br> <input type="submit"/> </form>

Затем, после нажатия кнопки отправки, вы можете получить отформатированный html в вашем сервлете / контроллере:

String htmlContent = request.getParameter("editor1");

Вы также можете передать эту переменную, содержащую отформатированный html ('htmlContent'), в ITEXT (или некоторые другие конвертеры pdf) для создания pdf ...