ckeditor - onpaste событие - PullRequest
       17

ckeditor - onpaste событие

14 голосов
/ 06 января 2010

Кто-нибудь знает, как я могу прикрепить событие onpaste в CKEditor 3.x?

Я в основном хочу получить CTRL + V данные и добавить немного текста к нему, а затем добавить его в редактор.

Я оглянулся, но не нашел окончательного ответа. Форум CKEditor не очень помогает.

Ответы [ 5 ]

18 голосов
/ 14 февраля 2010

Это должно сработать

var editor = CKEDITOR.instances.YourInputControlName;
editor.on('paste', function(evt) {
    // Update the text
    evt.editor.setData(evt.editor.getData() + ' your additional comments.');
}, editor.element.$);
12 голосов
/ 10 ноября 2011

Оба примера немного синтетические.

Сначала editor.getData () получает все содержимое редактора, поэтому, если вы хотите обрабатывать только вставленные данные, вам нужно получить ev.data.html и вставить в нужное место.

editor = CKEDITOR.instances.editor1;
editor.on('paste', function (evt) {
    var editor = evt.editor;
    evt.stop(); // we don't let editor to paste data, only for current event
    // show loader that blocks editor changes
    $.post('clean.php', {html: evt.data.html}, function (data) {
        editor.insertHtml( data.html ); // text will be inserted at correct place
        // hide loader
    }, 'json');
});

Не используйте функции editor.setReadonly (true / false), вы не сможете вставить текст в правильном месте (в случаях с асинхронной обработкой данных).

12 голосов
/ 28 сентября 2011

В этом примере редактируется вставляемый контент, удаляя все элементы img.

CKEDITOR.on('instanceReady', function (ev) {
    ev.editor.on('paste', function (ev) {
        ev.data.html = ev.data.html.replace(/<img( [^>]*)?>/gi, '');
    });
});
1 голос
/ 10 февраля 2014
editor = CKEDITOR.instances[id];

editor.on('paste', function (evt) {
    evt.stop();
    var data = evt.data.dataValue;

    if (window.chrome || window.safari) {
        // removing span wrapper on webkit browsers.
        data = $(data).html();
    }
    evt.editor.insertHtml(data);
});
1 голос
/ 18 декабря 2013

Я знаю, что это старый вопрос, но подумал, что добавлю свою версию ответа aliaksej, так как он позволяет использовать собственный «очиститель» - он не работал для меня, пока я не изменил его, как показано ниже. *

editor = CKEDITOR.instances[id];
editor.on('paste', function (evt) { 
   evt.stop();
   $.post('/actions/clean.php', {html: evt.data.dataValue}).done(function (data) {
      evt.editor.insertHtml(data);
   }, 'json');
});
...