内联模式下的TinyMCE 4插件中的自定义模态屏幕

时间:2013-07-31 14:22:12

标签: plugins tinymce tinymce-4 bootstrap-modal

我正在为新的TinyMCE 4开发一个自定义插件。这个插件使用模态屏幕。因为我想使用我已经开发的模态屏幕/ JS服务,所以选择不要使用TinyMce的窗口管理器

问题在于,当我打开我的开放式模态屏幕时,TinyMCE就会失去焦点。我希望TinyMce保持工具栏的打开,否则我无法与编辑器交互。 TinyMCe因为收到模糊事件而关闭(很可能因为它不知道任何打开的窗口)。

可以在以下小提琴中找到显示问题的缩小问题。单击示例按钮后会立即出现此问题。 http://fiddle.tinymce.com/pudaab/1

缩短的代码如下:

tinymce.PluginManager.add('example', function(editor, url) {
    // Add a button that opens a window
    editor.addButton('example', {
        text: 'My button',
        icon: false,
        onclick: function() {
            var selection = editor.selection,
                dom = editor.dom,
                selectedElm,
                anchorElm;

            // Focus the editor since selection is lost on WebKit in inline mode
            editor.focus();

           // Open a modal screen using bootstrap
            $('#elem').modal();

            // Note: As soon as modal opens TinyMce receives a blur event and disables the toolbar
        }
    });
});

1 个答案:

答案 0 :(得分:2)

我终于设法自己解决了。诀窍是在调用模态屏幕之前调用editor.nodeChanged()。然后当您关闭模态屏幕时,请拨打editor.focus()

感谢您的帮助!