2010-01-06 8 views
13

Weiß jemand, wie ich ein Ereignis onpaste in CKEditor 3.x anhängen kann?ckeditor - onpaste event

Ich mag im Grunde CTRL +V Angaben und fügen Sie einigen Text, um ihn greifen und es dann in den Editor hinzufügen.

Ich habe mich umgeschaut, aber habe keine definitive Antwort gefunden. CKEditor Forum ist nicht viel Hilfe. Dies sollte durch die Beseitigung aller img Elemente eingefügt werden, um den Trick

var editor = CKEDITOR.instances.YourInputControlName; 
editor.on('paste', function(evt) { 
    // Update the text 
    evt.editor.setData(evt.editor.getData() + ' your additional comments.'); 
}, editor.element.$); 

Antwort

18

.

+2

Seien Sie gewarnt, dass, wenn Sie IE-Benutzer haben, die Umschalt + Einfügen, werden Ihre Paste-Handler ausgeführt werden einzufügen. – vegemite4me

12

Dieses Beispiel bearbeitet den Inhalt tun

10

Ihre beiden Beispiele sind ein wenig synthetisch.

Zunächst erhält editor.getData() den gesamten Inhalt des Editors. Wenn Sie also nur eingefügte Daten verarbeiten möchten, müssen Sie ev.data.html aufrufen und an der richtigen Stelle einfügen.

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

Nicht-Funktionen verwenden editor.setReadonly (true/false), werden Sie nicht in der Lage sein, Text in der richtigen Stelle einzufügen (in Fällen mit der Verarbeitung asynchroner Daten).

+0

das Attribut 'evt.data.html' wurde in CKEditor v4 + zu' evt.data.dataValue', wie in einer anderen Antwort http://stackoverflow.com/a/21677580/823020 – nimasmi

1

Ich weiß, es ist eine alte Frage, aber ich dachte, ich würde meine Version von aliaksej's Antwort hinzufügen, da es die Verwendung eines benutzerdefinierten "Cleaner" erlaubt - es hat nicht ganz funktioniert, bis ich es wie folgt geändert habe.

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'); 
}); 
+0

das Attribut 'evt.data.html' wurde in CKEditor v4 + 'evt.data.dataValue ', wie in einer anderen Antwort http://stackoverflow.com/a/21677580/823020 – nimasmi

+0

editierte Antwort, danke! –

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