TinyMCE 在焦点上显示菜单答案

【问题标题】：TinyMCE show menu on focusTinyMCE 在焦点上显示菜单
【发布时间】：2014-07-16 06:22:19
【问题描述】：

我是项目中的 tinyMCE。

我有两个文本区域。我只需要显示活动控件的控件。我有两个选择：

对两者都有一个共同的控制。
隐藏非活动编辑器的控件。

我想不出第一个选项。我选择了第二种方法。

现在我可以在编辑器处于焦点时触发事件。当它失去焦点时，我需要帮助从编辑器中删除菜单和工具。

这是关于我如何接近第二个选项的代码：

setup : function(ed) {
            ed.on("focusout", function() {
                tinyMCE.activeEditor.execCommand('mceSetAttribute','toolbar','false');
           console.log(tinyMCE.activeEditor.execCommand('mceSetAttribute','toolbar','false'));
            });
            ed.on("focus", function() {

                });
        }

【问题讨论】：

我确信我在聚焦代码部分中所做的任何事情都是错误的。感谢有人能告诉我代码应该是什么。
没有focuout事件AFAIK，但是有blur事件tinymce.com/wiki.php/api4:event.tinymce.Editor.blur

标签： jquery jquery-ui tinymce tinymce-4 tinymce-3

【解决方案1】：

这适用于 tinyMCE 4（假设您使用的是 jQuery）：

setup: function(editor) {
    editor.on("init", function() {
        editor.contentParent = $(this.contentAreaContainer.parentElement);
        editor.contentParent.find("div.mce-toolbar-grp").hide();
    });
    editor.on('focus', function () {
        editor.contentParent.find("div.mce-toolbar-grp").show();
    });
    editor.on('blur', function () {
        editor.contentParent.find("div.mce-toolbar-grp").hide();
    });
}

小提示：如果使用 AngularJS，您也可以使用 angular.element(...) 代替 $(...)。

【讨论】：