如何使用Javascript在CKEditor中设置值?

时间:2010-08-31 14:32:31

标签: javascript ckeditor

我想知道如何使用Javascript在CKEditor中设置值?

我尝试了以下内容,但它们都不起作用......

document.[form name].[textarea name].value=data;
$('#textareaID').val(data);

然而,这些都没有应用编辑器。有没有办法用编辑器做到这一点?

10 个答案:

答案 0 :(得分:81)

使用CKEditor方法setData()

CKEDITOR.instances[**fieldname**].setData(**your data**)

答案 1 :(得分:29)

insertHtml()insertText()方法会将数据插入编辑器窗口,添加到已有的数据中。

但是,要替换整个编辑器内容,请使用setData()

答案 2 :(得分:10)

使用insertHtml()insertText()方法。

答案 3 :(得分:6)

我使用了以下代码,它正如描述 - >

一样正常
CKEDITOR.instances.mail_msg.insertText(obj["template"]);

这里 - > CKEDITOR - >您的编辑名称, mail_msg - >你的textarea的id(你绑定ckeditor), obj["template"] - >是您想要绑定的值

答案 4 :(得分:4)

试试这个

CKEDITOR.instances['textareaId'].setData(value);

答案 5 :(得分:2)

设置编辑器数据。必须以原始格式(HTML)提供数据。 CKEDITOR.instances.editor1.setData('把你的数据。'); refer this page

答案 6 :(得分:2)

<textarea id="editor1" name="editor1">This is sample text</textarea>

<div id="trackingDiv" ></div>

<script type="text/javascript">
    CKEDITOR.replace( 'editor1' );

</script>

试试吧..

更新:

设置数据:

创建实例First ::

var editor = CKEDITOR.instances['editor1'];

然后,

editor.setData('your data');

editor.insertHtml('your html data');

editor.insertText('your text data');  

从编辑器中检索数据::

editor.getData();

如果在CKEditor中更改特定的para HTML数据。

var html = $(editor.editable.$);
$('#id_of_para',html).html('your html data');

这些是我在CKEditor中可能知道的方式

答案 7 :(得分:1)

注意从传递给setData().的任何字符串中删除换行符,否则会抛出异常。

另请注意,即使您这样做,然后使用getData(),再次获取该数据CKEditor将换行符放回。

答案 8 :(得分:1)

直到今天CKEditor 4+发布,我们都必须使用它。ekeditor 4 setData documentation

CKEDITOR.instances['editor1'].setData(value);

editor1是文本区域 Id

诸如insertHtml('html data')insertText('text data')之类的旧方法也可以正常工作。

并获取数据使用

var ckdata =  CKEDITOR.instances['editor1'].getData();
var data = CKEDITOR.instances.editor1.getData();

Ckedtor 4 documentation

答案 9 :(得分:0)

我尝试过并为我工作。

success: function (response) {
    document.getElementById('packageItems').value = response.package_items;

    ClassicEditor
    .create(document.querySelector('#packageItems'), {
        removePlugins: ['dragdrop']
    })
    .then(function (editor) {
        editor.setData(response.package_items);
    })
    .catch(function (err) {
        console.error(err);
    });
},