CKEditor 4内联：如何隐藏工具栏按需？ [英] CKEditor 4 Inline: How to hide toolbar on demand?

问题描述

正常情况下，当您单击页面中除编辑区域之外的其他位置时，工具栏将隐藏，现在我还需要在用户命令（例如用户按快捷键）上隐藏工具栏。

我试图在ckeditor工具栏div上调用jQuery 隐藏方法，但一旦被隐藏，即使用户专注于编辑区域

有关如何实现这一点的任何想法？非常感谢。

解决方案

当焦点回到编辑区域时，

您还可以附加到焦点和模糊事件以显示和隐藏工具栏：

  //编辑器获取焦点时调用showToolBarDiv（）
 editor.on（'focus'，function（event）
 {
 showToolBarDiv（event）; 
} 
 //编辑器失去焦点时调用hideToolBarDiv（）
 editor.on（'blur'，function（event）
 {
 hideToolBarDiv（event）; 
} ）; 
 
 
 //每当CKEditor获得焦点时。我们将显示工具栏DIV。 
 function showToolBarDiv（event）
 {
 //选择正确的工具栏DIV并显示它。 
 //'event.editor.name'返回DIV接收焦点的名称。 
 $（'＃'+ event.editor.name +'TBdiv'）。show（）; 
} 
 
 //当CKEditor失去焦点时，我们将隐藏相应的工具栏DIV。 
 function hideToolBarDiv（event）
 {
 //选择正确的工具栏DIV并隐藏它。 
 //'event.editor.name'返回DIV接收焦点的名称。 
 $（'＃'+ event.editor.name +'TBdiv'）。hide（）; 
} 
  

Normally when you click other place in the page other than the edit area, the toolbar will hide, now i need to hide the toolbar also on user command(such as user press a shortcut).

I tried to call jQuery hide method on ckeditor toolbar div, but once hidden, it will never become visible even when user focus on the edit area.

Any ideas on how to achieve this? Many thanks.

解决方案

did you try to do jQuery Show when the focus comes back in to the edit area?

you can also attach to the focus and blur events to show and hide toolbar:

// Call showToolBarDiv() when editor get the focus
    editor.on('focus', function (event)
    {
               showToolBarDiv( event );
     });
    // Call hideToolBarDiv() when editor loses the focus
    editor.on('blur', function (event)
    {
               hideToolBarDiv( event );
    });


    //Whenever CKEditor get focus. We will show the toolbar DIV.
     function showToolBarDiv( event )
     {
      // Select the correct toolbar DIV and show it.
      //'event.editor.name' returns the name of the DIV receiving focus.
        $('#'+event.editor.name+'TBdiv').show();
     }

     //Whenever CKEditor loses focus, We will hide the corresponding toolbar DIV.
     function hideToolBarDiv( event )
     {
        // Select the correct toolbar DIV and hide it.
        //'event.editor.name' returns the name of the DIV receiving focus.
        $('#'+event.editor.name+'TBdiv').hide();
     }

这篇关于CKEditor 4内联：如何隐藏工具栏按需？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！