CKEditor 插入 HTML

CKEditor Insert HTML

  1. 我有来自数据库的数据。
  2. 在我的 js 文件中,我想更改我的 CKEditor 文本编辑器的值。
  3. 我的值是原始值 html。
  4. 我想把这个原始值写在一个空的 CKEditor 文本编辑器上。

我尝试了这些,但一直出现未定义的函数错误:

CKEDITOR.instances.myEditorID.insertHtml( '<p>This is a new paragraph.</p>' );
CKEDITOR.instances.myEditorID.setData( '<p>This is the editor data.</p>' );

我也试过了,但还是未定义函数错误:

CKEDITOR.instances.YOUREDITORID.updateElement();
alert( document.getElementById( 'YOUREDITORID' ).value );

我尝试了 'editor'、'editor1'、'editor2' 而不是 myEditorID,但仍然对我不起作用。

提前致谢。

---更新---

这是我的 ckeditor 文本编辑器的 html :

<textarea id="myEditorID" name="myEditor"></textarea>
<script type="text/javascript">
    $(function () {
        var myEditor = $('#myEditorID');
        myEditor.ckeditor({ 
        height: 200, 
        extraPlugins: 'charcount', 
        maxLength: 2000, 
        toolbar: 'TinyBare', 
        toolbar_TinyBare: [
             ['Bold','Italic','Underline'],
             ['Undo','Redo'],['Cut','Copy','Paste'],
             ['NumberedList','BulletedList','Table'],['CharCount']
        ] 
        }).ckeditor().editor.on('key', function(obj) {
            if (obj.data.keyCode === 8 || obj.data.keyCode === 46) {
                return true;
            }
            if (myEditor.ckeditor().editor.document.getBody().getText().length >= 2000) {
                alert('You have reached the maximum char length');
                return false;
            }
        });
    });
</script>

Instead of myEditorID i tried 'editor', 'editor1', 'editor2' but still doesn't work for me.

您需要查看页面的 HTML 并查看您的编辑器的 ID 字段。会是这样的

<textarea id="my_editor"></textarea>

id 属性是这里需要的内容

CKEDITOR.instances.my_editor.insertHtml('<p>This is a new paragraph.</p>');

如果你有像

这样的 CKeditor
<textarea id="user_body"></textarea>

要插入数据,请使用下面这行代码

CKEDITOR.instances["user_body"].insertHtml('');

希望对您有用。谢谢

在你的HTML

<textarea name="contenteditor" id="contenteditor" style="margin:0px 10px;">
</textarea>

在你的 JavaScript (JQuery)

$(function(){
    CKEDITOR.replace('contenteditor');

    //Your data
    var yourData = '<p>This is a new paragraph.</p>';

    //insert your data in the editor
    $("#contenteditor").val(yourData);
})