Ckeditor：根据需要显示和隐藏内联工具栏

我使用内联Ckeditor来编辑内容。默认情况下，内联编辑器通过双击与contenteditable="true"的div激活。当我点击一个按钮时，我想激活这个内联编辑器，并且当我点击另一个按钮时隐藏它。下面是HTML代码的例子：Ckeditor：根据需要显示和隐藏内联工具栏

<html> 
    <head> 
    <script src="ckeditor/ckeditor.js"></script> 
    </head> 
<body> 
    <div id="first" contenteditable="true">first</div> 
    <div id="second" contenteditable="true">second</div> 

    <input type="button" value="show inline editor"> 
    <input type="button" value="hide inline editor"> 
</body> 
</html>

的jsfiddle显示了默认的行为，我想有http://jsfiddle.net/vdRYL/

来源

2013-12-08 user2265529

结束这将是容易让我们来解决这个问题，如果你能创造出CKEDITOR的默认行为的jsfiddle（jsfiddle.net）。 – Rao

感谢您的回复和编辑。这里是jsfiddle：http://jsfiddle.net/vdRYL/ – user2265529

的CKEDITOR似乎被激活的contenteditable元素，而不是对focus编辑窗口什么double-click。你可以做这样的事情，让您的按钮来上班，

http://jsfiddle.net/nagendra_rao/vdRYL/1/

来源

2013-12-08 03:48:34 Rao

可以以隐藏工具栏使用focusManager.blur(true)。

http://jsfiddle.net/vdRYL/24/上的FocusManager这里

var cke = CKEDITOR.inline('target'); 

var btnClose = document.getElementById('btnClose'); 
btnClose.addEventListener('click', function(event){ 
cke.focusManager.blur(true); 
});

来源

2015-09-10 06:59:04 GibboK

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

打开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'; 

     }); 
    }); 
});

来源

2018-02-09 21:04:30 sAcH

Ckeditor：根据需要显示和隐藏内联工具栏

回答

相关问题