javascript - Ckeditor Inline 动态修改工具栏以实现内容编辑

Question

我正在将 ckeditor 内联用于我的 contenteditable div。

HTML 看起来像

<div class="content" contenteditable="true">
  <p>Test</p>
  <p>Test</p>
</div>

我想在单击按钮时更改工具栏中的按钮。我调用以下函数来更改工具栏

function changeToolBar(){
  var myToolBar = [{ name: 'verticalCustomToolbar', groups: [ 'basicstyles'], items: [ 'Blockquote'] }];
 var config = {};
 config.toolbar = myToolBar;
 CKEDITOR.instances.editor1.destroy();//destroy the existing editor
 CKEDITOR.replace('content', config);       

}

这个似乎不起作用。

JSFiddle http://jsfiddle.net/RKPYw/17/

提前致谢

Answer 1

通过将代码更改为以下内容来修复它

function changeToolBar() {
 var myToolBar = [{ name: 'verticalCustomToolbar', groups: [ 'basicstyles'], items: [ 'Bold'] }];
 var config = {};
 config.toolbar = myToolBar;
 CKEDITOR.instances.test.destroy();//destroy the existing editor
 CKEDITOR.inline('test', config);      
}

CKEditor.inline函数需要元素的id

JSFiddle在这里http://jsfiddle.net/RKPYw/18/