Question

我尝试将一个非常简单的工具栏配置应用于内联CKEditor。目标是只显示一个Bold按钮，但它不起作用。为什么呢？

CKEDITOR.inline(el.get(0),
{
  toolbar:
  [
     { name: 'basicstyles', items: [ 'Bold' ] }
  ]  
});

https://jsfiddle.net/adrianrosca/q6x6s6ga/

Answer 1

我已经分叉并更新了你的小提琴：https://jsfiddle.net/Comandeer/q6x6s6ga/30/

<TabItem Header="General" Tag="{StaticResource testImage}" >

您的代码存在两个问题：

您没有考虑到CKEditor会自动将所有$( function() { var el = $( '#editor1' ); el.attr( 'contenteditable', true ); CKEDITOR.inline( el.get( 0 ), { toolbar: [ [ 'Bold' ] ] } ); } );元素转换为其实例的事实，您必须disable it first。因此，在JS代码中添加[contenteditable=true]然后创建内联编辑器会更容易。
您的工具栏语法错误。 The configuration option将数组或字符串作为参数 - 而不是对象。

修改：[contenteditable] https://jsfiddle.net/Comandeer/q6x6s6ga/31/

问题在于等待CKEDITOR.disableAutoInline事件。如果您只是将代码放在onload的末尾，那么一切正常。

Answer 2

您可以解决更新CKEDITOR来源，即

http://cdn.ckeditor.com/4.5.7/standard/ckeditor.js

按如下方式编辑代码：

$(function()
 {
     var el = $("div");
     CKEDITOR.disableAutoInline = true;

  for (var inst in CKEDITOR.instances) {
     CKEDITOR.instances[inst].destroy();
   }

  CKEDITOR.inline(el.get(0),
  {
    toolbar:
    [
        { name: 'basicstyles', items: [ 'Bold' ] }
    ]  
  });
});

工具栏配置无法与内联CKEditor

2 个答案: