如何在 CKEDITOR 内联中禁用自动 hide/show 工具栏

Question

CKEDITOR 内联 shows/hide 聚焦或模糊内容为 contenteditable="true" 的 DOM 元素时的工具栏。

例如，如果用户单击页面背景，CKEDITOR 会隐藏工具栏。

我需要始终显示工具栏并禁用任何自动 show/hide 功能。

有什么方法可以实现吗？

<script src="//cdn.ckeditor.com/4.5.3/standard/ckeditor.js"></script>
Default behaviour: 
<div id="first" contenteditable="true">Click me</div>
<br>

我试过了

CKEDITOR.inline(this._cloneDom.id, { startupFocus: false });

但没有成功

Answer 1

这是我所做的并且似乎有效：

// in config I have set the recommended value:
config.startupFocus = true;

// load the editor
var instance = CKEDITOR.inline(element.id, {
    // ... load config
});

// this works to prevent hiding of the editor, I don't know yet if this breaks anything, 
// but seems to be working fine
instance.on('blur',function(){
   return false;
});


// and because the startupFocus property triggers focus on each element that has the editor
// I scroll the document to the top on the event when editor is ready
instance.on("instanceReady", function(){
     document.body.scrollTop = document.documentElement.scrollTop = 0;
});

Answer 2

我们可以隐藏和显示工具栏。我使用以下方式实现了此功能：

打开 ckeditor.js 文件。并在文件末尾粘贴以下代码

$(document).ready(function () {  
   CKEDITOR.on('instanceReady', function (ev) {  
      document.getElementById(ev.editor.id + '_top').style.display = 'none';  


      ev.editor.on('focus', function (e) {  
         document.getElementById(ev.editor.id + '_top').style.display = 'block';  

      });  
      ev.editor.on('blur', function (e) {  
         document.getElementById(ev.editor.id + '_top').style.display = 'none';  

      });  
   });  
});

如何在 CKEDITOR 内联中禁用自动 hide/show 工具栏

How to disable auto hide/show toolbar in CKEDITOR inline

javascript

ckeditor

ckeditor4.x