点击即可关闭TinyMCE插件窗口

时间:2015-02-11 作者:cfx

我创建了一个小插件,在TinyMCE工具栏上添加了一个按钮。单击会打开一个弹出窗口,通过editor.windowManager.open(). 通过(1)单击“取消”或“确定”按钮,或(2)按esc 钥匙

我想知道如何通过点击关闭插件的弹出窗口(例如,如果我点击弹出窗口外的TinyMCE覆盖)。WP的插入/编辑链接会触发一个具有该功能的弹出窗口,但据我所知,该插件使用一个自定义对话框,我希望有一个TinyMCE API方法/属性可以实现这一点,但文档非常简洁。

这是我的插件,供参考:

(function() {
  tinymce.PluginManager.add(\'custom_plugin\', function(editor, url) {
    editor.addButton(\'custom_plugin\', {
      text: \'Plugin\',
      icon: false,
      onClick: function() {
        editor.windowManager.open({
          title: \'Custom Plugin\',
          body: [
            {
              type: \'textbox\',
              name: \'theText\',
              label: \'Text\',
              value: \'\',
              minWidth: 800
            }
          ],
          onsubmit: function(e) {
            editor.insertContent(\'[tag]\'+e.data.theText+\'[/tag]\');
          }
        });
      });
    });
  });
})();

1 个回复
SO网友:Sohan Zaman

你很久以前问过这个问题,但我也在寻找类似的问题并找到了解决方案。

在编辑后屏幕(我们有tinyMCE)中将管理端脚本排队。然后使用以下代码:

(function($) {
    \'use strict\';

    $(document).ready(function() {
        $(document).on( \'click\', \'#mce-modal-block\', function() {
            tinyMCE.activeEditor.windowManager.close();
        });
    });

})(jQuery);
这样,您可以通过单击tinyMCE的外部来关闭任何弹出窗口。

结束