javascript ckeditor getData() 似乎无法正常工作
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14062654/
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
ckeditor getData() doesnt seem to work as it should
提问by Jesse
First off I'll start off by saying I am new to javascript so hopefully this isn't a complete face palm question. That being said, the following code should alert the value of the editor when the user clicks off of it.
首先，我首先要说我是 javascript 新手，所以希望这不是一个完整的手掌问题。话虽如此，下面的代码应该在用户点击编辑器时提醒它的值。
<script type='text/javascript'>
function openEditor(){
html = "Hello World";
config = {
startupFocus : true
};
editor = CKEDITOR.appendTo( 'textBox', config, html );
if (editor) {
editor.on('blur', function(event) {
var ckvalue = CKEDITOR.instances.editor.getData();
alert(ckvalue);
});
}
}
</script>
<html>
<a href='#' onclick='openEditor()'>Open Editor</a><br />
<div id='textBox'></div>
</html>
Instead google chrome console reports:
而是谷歌浏览器控制台报告：
"Uncaught TypeError: Cannot call method 'getData' of undefined "
"Uncaught TypeError: Cannot call method 'getData' of undefined "
Now when I change
现在当我改变
var ckvalue = CKEDITOR.instances.editor.getData();
to
到
var ckvalue = CKEDITOR.instances.editor1.getData();
It works. This baffles me because I never declared a editor1 instance. I was hoping someone with a little more experience could explain to me why editor1 works when editor doesnt.
有用。这让我感到困惑，因为我从未声明过 editor1 实例。我希望有更多经验的人可以向我解释为什么 editor1 起作用而 editor 不起作用。
Here is a working example of what Im talking about: http://jsfiddle.net/s3aDC/6/
这是我谈论的一个工作示例：http: //jsfiddle.net/s3aDC/6/
回答by oleq
editoris a JS variable that points to CKEDITOR.instances.editor1. See that editor === CKEDITOR.instances.editor1 // true.
editor是一个 JS 变量，指向CKEDITOR.instances.editor1. 看到那个editor === CKEDITOR.instances.editor1 // true。
Moreover, event callback is executed in editorcontext, so thispoints to editor:
此外，事件回调是在editor上下文中执行的，因此this指向editor：
editor.on('blur', function(event) {
var ckvalue = this.getData();
alert(ckvalue);
});
And you can define it when initializing the editor:
您可以在初始化编辑器时定义它：
var editor = CKEDITOR.appendTo( 'textBox', {
on: {
blur: function( event ) {
console.log( this.getData() );
}
}
} );
And you should definitely avoid global variablesin your code! ;)
回答by Reinmar
CKEditor gets editor name from:
CKEditor 从以下位置获取编辑器名称：
- id or name attribute of textarea/editable element if editor isn't in "append to" mode: https://github.com/ckeditor/ckeditor-dev/blob/master/core/editor.js#L71
- function that generates unique editors names https://github.com/ckeditor/ckeditor-dev/blob/master/core/editor.js#L97
- 如果编辑器未处于“附加到”模式，则 textarea/editable 元素的 id 或 name 属性：https: //github.com/ckeditor/ckeditor-dev/blob/master/core/editor.js#L71
- 生成唯一编辑器名称的函数https://github.com/ckeditor/ckeditor-dev/blob/master/core/editor.js#L97
In your case editor is created by appendTo()method so CKEditor automatically generate name which is editor1, then editor2, etc. CKEDITOR.instancesobject contains all editor instances under their name, that's why there exists CKEDITOR.instances.editor1.
在您的情况下，编辑器是通过appendTo()方法创建的，因此 CKEditor 会自动生成名称，即editor1，然后editor2等CKEDITOR.instances对象包含其名称下的所有编辑器实例，这就是为什么存在CKEDITOR.instances.editor1.
You assigned editor instance to global editorvariable. But that's something completely different than editor name - you can have editor instance assigned to as many variables as you wish.
您将编辑器实例分配给全局editor变量。但这与编辑器名称完全不同 - 您可以将编辑器实例分配给任意数量的变量。
BTW. You should declare variables with varstatement before using them.
顺便提一句。你应该var在使用它们之前用 statement声明变量。
