加载CKEditor后,我需要为keypress添加一个事件监听器。 的代码是一样的东西:
为ckeditor中的按键添加事件监听器的代码
CKEDITOR.instances.editor1.document.on('key', function(event) {
/* instructions */
});
任何想法我在哪里可以添加代码是什么?在哪个文件或以什么方式?
加载CKEditor后,我需要为keypress添加一个事件监听器。 的代码是一样的东西:
为ckeditor中的按键添加事件监听器的代码
CKEDITOR.instances.editor1.document.on('key', function(event) {
/* instructions */
});
任何想法我在哪里可以添加代码是什么?在哪个文件或以什么方式?
代码归档是这样的:
CKEDITOR.on('instanceCreated', function(e) {
e.editor.on('contentDom', function() {
e.editor.document.on('keyup', function(event) {
// keyup event in ckeditor
}
);
});
});
编辑 - 2014 - 因为这个答案还是得到了一些upvotes,我认为这将是公平地指出,这是在意味着CKEditor的版本3.x.随着4.x版本有变化的情况下,这将引发不仅在关键事件,而且粘贴后,撤消,重做等
在它的代码是这样的:
CKEDITOR.on('instanceCreated', function(e) {
e.editor.on('change', function (event) {
// change event in CKEditor 4.x
});
});
您可以将该代码添加到您的页面或页面中包含的.js文件中。该代码没有神秘感。
不,不工作这样... :( – ghostCoder 2011-06-19 17:38:53
这是很久以前的事,但我认为下跌是不公平的,并且“撤消”其中的一个,问题在于代码的放置位置,而不是代码本身,除了页面上包含的js文件或页面上的js以外,还可以将任何ckEditor js代码?我同意,虽然答案有点简洁,但并不特别有帮助。我还注意到@Gabriel在他的回答中引用了同一作者的一篇文章(没有提到代码的放置位置)。 – 2014-11-07 10:28:54
你需要跟踪更改?
我最初使用上面的解决方案,但我最终将其替换为OnChange CKEditor plugin。这在一些特殊情况下非常有用 - 例如,如果使用工具栏添加链接,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实例。
我已经测试了一些在这里提出的解决方案中,我得到了我的anwser当我发现这个链接: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();
});
});
CKEDITOR.instances.editor1.on('change', function() { //Do something here.});
此代码注册任何更改事件,包括复制粘贴。
如果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
}
});
谢谢一个十亿美元工作出色。 – ghostCoder 2011-06-20 12:59:42
这会附加到CKEDITOR创建的每个实例吗? – Chris 2011-09-08 19:01:11