如何找出tinyMCE中的更改文本颜色按钮触发了哪个动作，以及如何将其与我的自定义按钮链接？

如何解决如何找出tinyMCE中的更改文本颜色按钮触发了哪个动作，以及如何将其与我的自定义按钮链接？

我正在尝试在项目中使用tinyMCE，我知道如何在编辑器init f.ex中向编辑器添加功能：

toolbar: '| forecolor backcolor removeformat |',

但是我有自己的定制工具栏，该工具栏与tinyMCE编辑器完全分开（我已经用HTML构建了它）。因此，我有个应该用来更改所选文本颜色的按钮，问题是如何将我的自定义按钮与由原始tinyMCE工具栏图标触发的操作链接以更改前景色？

解决方法

您可以在TinyMCE配置中添加一些代码，以查看在TinyMCE中发出命令的时间。

setup: function(editor) {
    editor.on('ExecCommand',function (e) {
        console.log('ExecCommand:',e);
    });
} 

这将在运行TinyMCE命令时将某些内容输出到浏览器的控制台。当您更新文字颜色时（通过forecolor工具栏按钮），您会看到如下命令：

ExecCommand: {
  command: "mceApplyTextcolor",ui: "forecolor",value: "#2DC26B",type: "execcommand",target: EE, 
  …
}

我创建了一个TinyMCE小提琴，它展示了如何使用execCommand从您自己的自定义代码执行相同的工作：

https://fiddle.tiny.cloud/Hxhaab/2