更改ckEditor的背景颜色 [英] changing the background color for ckEditor

问题描述

我需要改变背景颜色动态加载我的ckEditor
它是打开的页面是一个动态加载页面，他们的用户具有特定的bg颜色。
我无法加载css它只是编辑器主体背景颜色

所以我试过

  window.onload = function（）{
 CKEDITOR.instances.editor_data.addCss（'body {background-color：#efefef;}'）; 
} 
  

我没有得到错误， p>

我也尝试过

  CKEDITOR.instances.editor_data.addCss cke_editor_data {background-color：#efefef;}'）; 
  

解决方案

如果你在window.load太晚了， addCss 定义了在创建编辑器时加载的一些CSS，但它不会修改正在运行的实例。

所以你可以这样（只使用addCSS）：

  CKEDITOR.on（'instanceCreated'，function（e）{
 e.editor.addCss（'body {background-color：red;}'）; 
} ; 
  

或这是一种更通用的方式处理编辑的文档

  CKEDITOR.on（'instanceReady'，function（e）{
 //第一次
 e.editor.document.getBody ）.setStyle（'background-color'，'blue'）; 
 //如果用户切换到源和返回
 e.editor.on（'contentDom'，function（）{
 e.editor.document.getBody（）。setStyle（'background-color'，'blue'）; 
}）; 
}）; 
  

I need to change the background color dynamically on load with my ckEditor the page that it is on is a dynamically loading page where they user has a specific bg color. I can not load a css it has to be just the editor body background color

so i tried

window.onload=function(){
    CKEDITOR.instances.editor_data.addCss( 'body { background-color: #efefef; }' );
}

i do not get an error, but also do not get any changes

i also tried

CKEDITOR.instances.editor_data.addCss( '#cke_editor_data { background-color: #efefef; }' );

解决方案

If you're calling that during window.load then it's too late, addCss defines some css to load when the editor is created, but it doesn't modify the running instance.

So you can so this (using only addCSS):

CKEDITOR.on('instanceCreated', function(e) {
    e.editor.addCss( 'body { background-color: red; }' );
});

Or this (a more generic way to work with the edited document)

CKEDITOR.on('instanceReady', function(e) {
    // First time
    e.editor.document.getBody().setStyle('background-color', 'blue');
    // in case the user switches to source and back
    e.editor.on('contentDom', function() {
        e.editor.document.getBody().setStyle('background-color', 'blue');
    });
});

这篇关于更改ckEditor的背景颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！