自定义 tinymce 以添加自定义按钮答案

【问题标题】：Customize tinymce to add a custom button自定义 tinymce 以添加自定义按钮
【发布时间】：2017-11-01 05:15:28
【问题描述】：

我想在 tinymce 界面中添加一个自定义按钮以从服务器上传图片。

场景：我的 MVC 项目中有一个厨房页面，允许用户将图像、视频、音频和文本上传到服务器。这些媒体被上传到服务器，即。我们在服务器上有一个上传文件夹，将上传所有文件。

我想向 tinymce 添加一个按钮，单击该按钮将打开一个弹出窗口，其中包含图像/视频/音频/文本列表（来自服务器）。选择它时，应将内容添加到 tinymce 编辑器中。

弹出窗口看起来像这样：

任何帮助都会有所帮助。

【问题讨论】：

【解决方案1】：

TinyMCE 网站上有关于如何创建自定义工具栏按钮的文档：

然后，您可以在有人选择图像后使用insertContent API 将所需的 HTML 注入编辑器。

【讨论】：

【解决方案2】：

添加自定义按钮的代码：

tinymce.init({
selector: "your_selector",
plugins: [
    "your_custom_plugin"
],
toolbar1: "undo redo | your_custom_btn",

}

tinymce.activeEditor.addButton('your_custom_btn', {
    tooltip: 'click to show media',
    icon: 'media',
    onClick : showPopUP()
});

【讨论】：