Question

我在我的网络应用程序中使用CKEditor，而且我不知道如何使用HTML格式获取编辑器的内容。

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

这将获取在CKEditor中输入的文本，没有任何标记。

然而，

var q = objEditor.getHTML();

将返回null值。我做错了什么？

Answer 1

getHTML不是CKEditor对象的方法，因此您应该有一个javascript错误而不是null。

api定义的方法是getData()如果不起作用，那么你的代码中还有其他问题，请尝试使用警报来验证当时的内容。

Answer 2

只是要知道正确的方法getData()对我没有帮助。我不知道如何在CKEditor对象上使用它。并且CKEDITOR.getData()不起作用。

这就是CKEDITOR对象上使用getData()的方式：

CKEDITOR.instances.my_editor.getData()

...其中my_editor是用于CKEditor的textarea的id

与此相反的是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;

当您请求getData（）;

时，这将返回完整的html

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

对于Java用户......

按下提交按钮后，请求通过HTTP Post方法进行。此Post请求还包含使用textarea的name属性命名的参数中的格式化html。

所以，如果你的textarea就像......

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

然后，在按下提交按钮后，您可以通过以下方式获取servlet / controller中的格式化html：

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

您还可以将包含格式化html（'htmlContent'）的变量传递给ITEXT（或其他一些pdf转换器）以创建pdf ...

Answer 8

我意识到这已经过时了，但我很难找到有意义的答案并返回实际的HTML，包括图片。如果你的ckeditor实例附加到textarea，你可以简单地获取textarea的值来获取HTML。

例如，如果您正在使用jQuery：

$('#my_editor').val()

无需深入了解API。

Answer 9

如果您有两个 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

Online Demo (jsfiddle)

Answer 10

在 ckeditor 5 中，您可以使用editor.getData()

获取html数据。

这是一个示例：

ClassicEditor
    .create( document.querySelector( '#editor' ) )
    .then( editor => {
        console.log(editor.getData());
    } )
    .catch( error => {
        console.error( error );
    } );

Answer 11

我在编辑器中使用了插入媒体功能，.getData（）没有返回所需的HTML以显示视频缩略图图标。以下对我有用，以获取最终的HTML：

$(".ck-content").html()

Answer 12

试试这个：

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

使用CKEDITOR.instances.YOUREDITOR.element选择一个DOM元素，如果使用的话 CKEDITOR.instances.YOUREDITOR.element.getHtml（）; 你可以从编辑元素中获取所有html。

从CKEditor获取格式化的HTML

12 个答案: