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

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

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

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

Ответ 1

Код для архивирования выглядит примерно так:

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

Изменить - 2014 - Поскольку этот ответ по-прежнему получает некоторые обороты, я чувствовал, что было бы справедливо указать, что он предназначен для CKEditor в версии 3.x. В версии 4.x есть событие изменения, которое будет вызывать не только ключевые события, но и после вставки, отмены, повтора и т.д.

В коде это что-то вроде этого:

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

Ответ 2

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

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

Вот пример кода, обновленный для использования 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, который вы хотите отредактировать.

Ответ 3

Я тестировал некоторые предлагаемые решения, и я получил свой андерсер, когда нашел эту ссылку: 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();
    }); 
});

Ответ 4

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

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
    }
});

Ответ 5

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

Ответ 6

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

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