问题
How do I change the background colour of CKEditor, where the user types the text? I need to do this dynamically but I cant find the element that needs to change. ANy idea of how to target it?
回答1:
You can try with:
CKEDITOR.instances.editor1.document.getBody().setStyle('background-color', 'red');
Where CKEDITOR.instances.editor1
is an instance of editor - you can test this e.g. here: http://ckeditor.com/demo
回答2:
To change with 'myCss.css' file:
myJavascript:
CKEDITOR.document.$.body.className+=' nameofClass ';
myCss.css:
.nameofClass{
background-color: 'blue';
}
config.js of ckEditor folder:
config.contentsCss = '/path/myCss.css';
回答3:
If you want to change it with a change or click event:
<textarea id="content" class="main_editor" name="content"></textarea>
<input type="button" class="default-text" value="White" data-value="#ff0000" />
<script>
editor = CKEDITOR.replace("content");
$(document).on("click", ".default-text" , function(e) {
var color = $(this).data('value');
editor.document.$.childNodes[1].childNodes[1].style.color = color;
editor.focus();
});
</script>
I use jquery mini colors and a change event to dynamically change the background (style.background = color).
回答4:
Use the Firebug plugin on FF or the developer tools of Chrome to find the correct element to style.
来源:https://stackoverflow.com/questions/11084687/change-background-of-ckeditor