内联CKEditor,生成代码上有工具栏

我正在建立一个cms的后端。 我被要求创建一个模块,生成不同的块以快速创建页面(下面带有文本的图片,右边带有文本的图片等)

这一点是有效的,但编辑文本我正在尝试使用ckeditor。 使用以下代码,文本是可编辑的,但我没有得到工具栏:

{{title}}

{{text}}

为了尝试解决这个问题,我尝试使用CKEditor指南中的javascript:

 CKEDITOR.disableAutoInline = true; CKEDITOR.inline( 'editable' ); 

此代码只是创建一个错误:

 Uncaught TypeError: Cannot call method 'getEditor' of undefined 

我想这是因为在生成文本之前,编辑器没有任何内容可以链接到。

任何人都可以帮我用工具栏编辑生成的代码吗? 此外,是否可以让ckeditor使用类名而不是ID?

提前致谢

在初始化阶段, CKEditor会检查是否已有一个已绑定到该元素的编辑器实例。 您得到的错误表明您提供的元素的id尚未附加到DOM,或者在调用inline()之前已从DOM中删除。

确保订单正确:

 

{{title}}

{{text}}

JavaScript生成的

...

? 如果是这样,请确保在将元素注入DOM后调用inline()

“最后的希望”建议:你是否从不同的DOM范围(即iframe窗口)调用inline() )?

谢谢你的回答oleq。

是的,问题是在加载ckeditor之后插入了内容。 我也遇到了谷歌浏览器灰色工具栏的问题。

为了解决这两个问题,我在插入新内容后使用了以下代码:

 $('.editable').click(function() { var name; for(name in CKEDITOR.instances) { var instance = CKEDITOR.instances[name]; if(this && this == instance.element.$) { return; } } $(this).attr('contenteditable', true); CKEDITOR.inline(this); });