How to listen to basic events in CKEditor?

javascript html ckeditor
lisak picture lisak · Apr 19, 2011 · Viewed 31.8k times · Source

I can't figure out how to listen to focus, click, onKeyUp and other basic dom events in ckeditor. In the events summary there is only a few events regarding the lifecycle of ckeditor. And the "textArea" of ckeditor is an iframe, and it's html itself, so it is not clear on what dom node to listen.

Answer

lisak picture lisak · Apr 21, 2011

It's not a big deal, just do the following, works for focus, blur, click etc.

var ckeditor = CKEDITOR.instances['textArea_id'];
ckeditor.on('focus', fnHandler, context, data, priority);

or a jQuery example :

$(document).ready(function () {
    $('#YOUR_TEXTAREA_ID').ckeditor(ckeditor_config);

    CKEDITOR.instances.YOUR_TEXTAREA_ID.on('blur', fnHandler);
});

I don't know when this support appeared, but it definitely works for 3.5.x

Related questions

How to change the editor size of CKEditor?

Since it is a textarea , I tried cols="50" in html attribute but it does not work. Also , I found the answer from the previous question . He said I can do this by adding. CKEDITOR.instances.myinstance.resize(1000, 900); However , the size …

Read More
Change form values after submit button pressed

[EDIT] After a lot of digging around, I found out that the problem was in how I integrated the CKEditor into my page. The simple and obvious way does work in this case, as laid out in the accepted answer. …

Read More
Get formatted HTML from CKEditor

I'm using CKEditor in my web app, and I'm at a loss as to how to get the contents of the editor with HTML formatting. var objEditor = CKEDITOR.instances["sectionTextArea"]; var q = objEditor.getData(); This will get me the text …

Read More