ckeditor使用过程遇到的问题汇总

获取ckeditor对象

CKEDITOR.instances.ckeditor_name

获取ckeditor中的值和插入内容

CKEDITOR.instances.message.insertHtml(''); //插入html内容
//获取CKEditor的值 
var editor=CKEDITOR.replace( 'editor1' );
editor.document.getBody().getText(); //取得纯文本
editor.document.getBody().getHtml(); //取得html文本
CKEDITOR.instances.content.getData()=="")
//content是textarea的name

//设置CKEditor的值
CKEDITOR.instances.content.setData("CCCTO");
var editor = CKEDITOR.replace("content");
editor.setData("CCCTO");

//在编辑器中禁止粘贴
editor.on('paste', function() {
         return false;
});
//或者
editor.on('instanceReady', function(e) {
editor.on('paste', function() {
          return false;
});
});
//在 instanceReady中 绑定事件才可用

//需要新建实例,假若CKEditor实例已存在
if (CKEDITOR.instances['textarea_name']){
CKEDITOR.instances['textarea_name'].destroy();
}
CKEDITOR.replace('textarea_name');
function loadEditor(id)
{
    var instance = CKEDITOR.instances[id];
    if(instance)
    {
        CKEDITOR.remove(instance);
    }
    CKEDITOR.replace(id);
}
var instance = CKEDITOR.instances['test'];
if (instance) { 
CKEDITOR.remove(CKEDITOR.instances['test']);
 }  
if(CKEDITOR.instances[editorName])
delete CKEDITOR.instances[editorName];

CKEDITOR.replace(editorName);

在js中配置ckeditor

let configuration = {
            toolbar: "Full" ,
            filebrowserImageUploadUrl: appConfig.API_UPLOADIMAGES_BASE_URL + "uploadImageForRest" ,
            newButtonImageUploadUrl: appConfig.API_UPLOADIMAGES_BASE_URL + "uploadImage"
        };
        CKEDITOR.replace(this.elementName, configuration);
        CKEDITOR.instances[this.elementName].on("change", function () {
            let data = CKEDITOR.instances[this.elementName].getData();
            this.props.onChange(data);
        }.bind(this));
    }

获取ckeditor配置信息

CKEDITOR.instances.ckeditor_name.config.toolbar

ckeditor使用过程遇到的问题汇总

推荐阅读更多精彩内容