добавить код для прослушивателя событий для нажатия клавиш в ckeditor

Question

Мне нужно добавить прослушиватель событий для нажатия клавиш после загрузки CKEditor. Код выглядит примерно так:

CKEDITOR.instances.editor1.document.on('key', function(event) {
    /* instructions   */
});

Есть идеи, где я могу добавить код для этого? В каком файле или каким образом?

Answer 1

Код для архивирования это что-то вроде этого:

CKEDITOR.on('instanceCreated', function(e) {
        e.editor.on('contentDom', function() {
            e.editor.document.on('keyup', function(event) {
                // keyup event in ckeditor
            }
        );
    });
}); 

Edit - 2014 - Так как этот ответ все еще получает несколько голосов, я чувствовал, что было бы справедливо отметить, что он был предназначен для CKEditor в версии 3.x. В версии 4.x есть событие изменения, которое будет запускаться не только для ключевых событий, но также после вставки, отмены, повторного выполнения и т. Д.

В коде это примерно так:

CKEDITOR.on('instanceCreated', function(e) {
    e.editor.on('change', function (event) {
        // change event in CKEditor 4.x
    });
}); 

Answer 2

Вам нужно отслеживать изменения?

Первоначально я использовал решение, описанное выше, но в итоге я заменил его на плагин OnChange CKEditor .Это полезно в некоторых особых случаях - например, если вы добавляете ссылку с помощью панели инструментов, нажатие клавиши не регистрирует ничего.

Вот пример кода, обновленный для использования instanceCreated (сначала установите OnChange):

CKEDITOR.on('instanceCreated', function(e) {
    if (e.editor.name === editorId) { //editorId is the id of the textarea
        e.editor.on('change', function(evt) {
            //Text change code
        });
    }
});

Обновление: согласно ответу выше, CKEditor теперь имеет встроенное событие изменения, поэтому вам больше не нужно устанавливать плагин, чтобы использовать это решение.Вы все еще можете использовать вторую строку кода, чтобы применить изменения к экземпляру CKEditor, который вы хотите редактировать.

Answer 3

Если логика нажатия клавиш имеет смысл для данного плагина, вы можете включить его в определение плагина:

CKEDITOR.plugins.add('customPlugin', {
    // definition keys...
    init: function( editor ) {
        // Plugin logic
        ...

    // Register a  keydown event handler -- http://docs.ckeditor.com/#!/api/CKEDITOR.editor-event-key
    editor.on('key', function(event) {
        console.log('CKEDITOR keydown event from customPlugin'); // successfully captures keydown when registered from plugin
    }
});

Answer 4

CKEDITOR.instances.editor1.on('change', function () { //Do something here.});

Этот код регистрирует любое событие изменения, включая копирование-вставку.

Answer 5

Я протестировал некоторые из предложенных здесь решений и получил свой ответ, когда нашел эту ссылку: http://alfonsoml.blogspot.com.br/2011/03/onchange-event-for-ckeditor.html

Следующий код работал как шарм:

editor.on('contentDom', function()
{
    editor.document.on('keydown', function( event )
    {
        if ( !event.data.$.ctrlKey && !event.data.$.metaKey )
            somethingChanged();
    }); 
});

Answer 6

Вы добавляете этот код на свою страницу или в файл .js, включенный в вашу страницу. В этом коде нет никаких загадок.