4

首先，我将首先说我是 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>

相反，谷歌浏览器控制台报告：

"Uncaught TypeError: Cannot call method 'getData' of undefined "

现在当我改变

var ckvalue = CKEDITOR.instances.editor.getData();

至

var ckvalue = CKEDITOR.instances.editor1.getData();

有用。这让我感到困惑，因为我从未声明 editor1 实例。我希望有更多经验的人可以向我解释为什么 editor1 工作而 editor 不工作。

这是我在谈论的一个工作示例：http: //jsfiddle.net/s3aDC/6/

4

2 回答 2

5

editor是一个指向 的 JS 变量CKEDITOR.instances.editor1。看到那个editor === CKEDITOR.instances.editor1 // true。

此外，事件回调是在editor上下文中执行的，所以this指向editor：

editor.on('blur', function(event) {
    var ckvalue = this.getData();
    alert(ckvalue);
});

您可以在初始化编辑器时定义它：

var editor = CKEDITOR.appendTo( 'textBox', {
    on: {
        blur: function( event ) {
            console.log( this.getData() );
        }
    }
} );

而且您绝对应该避免在代码中使用全局变量！;)

于 2012-12-28T09:04:23.237 回答
1

CKEditor 从以下位置获取编辑器名称：

  1. 如果编辑器未处于“附加到”模式，则 textarea/editable 元素的 id 或 name 属性：https ://github.com/ckeditor/ckeditor-dev/blob/master/core/editor.js#L71
  2. 生成唯一编辑器名称的函数https://github.com/ckeditor/ckeditor-dev/blob/master/core/editor.js#L97

在您的情况下，编辑器是由appendTo()方法创建的，因此 CKEditor 会自动生成名称，即editor1, theneditor2等CKEDITOR.instances对象包含其名称下的所有编辑器实例，这就是存在的原因CKEDITOR.instances.editor1。

您将编辑器实例分配给全局editor变量。但这与编辑器名称完全不同——您可以将编辑器实例分配给任意数量的变量。

顺便提一句。在使用变量之前，您应该使用var语句声明变量。

于 2012-12-28T09:03:19.417 回答