jQuery ckeditor 内容的事件已更改

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/28087039/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 11:30:40  来源:igfitidea点击:

Event for ckeditor content changed

jqueryckeditor

提问by Micael Florêncio

If possible, how can we to the event of ckeditor's content being changed? For instance, there's some text already inserted into the ckeditor's content aka textarea when the page is opened. Afterwards I type something more or delete some of that text. Is there some event that's fired I can get to to change a variable when the text is changed?

如果可能,我们如何应对 ckeditor 内容被更改的事件?例如,当页面打开时,一些文本已经插入到 ckeditor 的内容中,即 textarea。之后我输入更多内容或删除一些文本。是否有一些事件触发了我可以在更改文本时更改变量?

I have this for regular textareas:

我有这个用于常规文本区域:

$("input,textarea").on("input", function () {
    booleanvar= true;
});

Saw a possible solution somewhere that had this:

在某处看到了一个可能的解决方案:

$('.ckeditor').ckeditorGet().on('key', function (e) {
    //some code
});

Tried it, but didn't work. And yes I know my ckeditor's textarea has "ckeditor" as its class so that's not the reason for it not to work.

试过了,但没有奏效。是的,我知道我的 ckeditor 的 textarea 有“ckeditor”作为它的类,所以这不是它不工作的原因。

So something like those examples I can use to get to some sort of textchanged event of ckeditor?

那么像我可以用来获得某种 ckeditor 的某种 textchanged 事件的例子吗?

回答by Nenotlep

Yes, there is the very handy changeeven that you can listen to. Documentation here: http://docs.ckeditor.com/#!/api/CKEDITOR.editor-event-change

是的,change即使您可以聆听,也非常方便。文档在这里:http: //docs.ckeditor.com/#!/api/CKEDITOR.editor-event-change

Use it for example like so (change editor1 to your editor instance):

例如像这样使用它(将 editor1 更改为您的编辑器实例):

CKEDITOR.instances.editor1.on('change', function() { 
    console.log("TEST");
});

回答by Dave

It is help me lot, for onchange of CKEDITOR.

对于CKEDITOR 的更改,这对我有很大帮助。

<textarea id="ckeditor_textarea " name="ckeditor_textarea ">Add Yore Data</textarea>

<script type="text/javascript">
var editor = CKEDITOR.replace( 'ckeditor_textarea ', {});
// editor is object of your CKEDITOR
editor.on('change',function(){
    console.log("test");
});
</script>

回答by Rohim Chou

Hope this might help someone else who comes across this post like me.. If you are using CKEditor5, could try this:

希望这可以帮助像我一样遇到这篇文章的其他人..如果您使用的是CKEditor5,可以试试这个:

ClassicEditor.create(document.querySelector('#editor'))
.then(editor => {
    editor.model.document.on('change:data', (evt, data) => {
        console.log(editor.getData());
    });
})
.catch(error => {
    console.error('Editor initialization error.', error);
});

回答by Bilmelimi B?lmemelimi

If you have a lot of ckeditor (version 4) in one page you could use this code:

如果您在一页中有很多 ckeditor(版本 4),您可以使用以下代码:

CKEDITOR.on('instanceCreated', function(event) {
 var editor = event.editor,
 element = editor.element;
 editor.on('change', function() {
 console.log(element.getId());
 });
 });

回答by PseudoNinja

Simple jQuery event binding for CKEditor4

CKEditor4 的简单 jQuery 事件绑定

$.fn.onDataChange = function (func) {
    var func = func || function () { };
    CKEDITOR.instances[$(this).attr('id')].on('change', function () {
        func();
    });
}