使用 TinyMCE 4 挂钩 onExecCommand 事件答案

【问题标题】：Hook into onExecCommand event with TinyMCE 4使用 TinyMCE 4 挂钩 onExecCommand 事件
【发布时间】：2013-05-12 19:39:22
【问题描述】：

我正在使用 TinyMCE 4，但文档很糟糕。我正在尝试在另一个 div（编辑器之外）中提供内容的实时预览。现在我正在听这些事件：

$(document).on('tinymce:changed tinymce:init', ...)

这在输入文本时有效，但在执行命令时不会触发（例如将现有文本更改为粗体）。

看起来在 TinyMCE 3.x 中有一个 onExecCommand 事件可以满足我的要求。但是我找不到任何关于如何收听全局 jQuery 事件的文档，就像我使用 change 和 init 所做的那样。有谁知道它触发了什么事件？

【问题讨论】：

【解决方案1】：

在migration guide 中可以找到以下示例：

// Old event
editor.onInit(editor, args) {
    // Custom logic
});

// New event
editor.on('init', function(args) {
    // Custom logic
});

所以一个问题是获得正确的事件名称和正确的编辑器实例 :) onExecCommand() 事件在 v4 中变为 'ExecCommand'。

所以在命令执行时添加处理程序应该是这样的（确保编辑器在执行下面的代码时已经初始化）：

for (ed_id in tinymce.editors) {
    tinymce.editors[ed_id].on('ExecCommand', function(args) {
       alert(1);
    });
}

由于某种原因，此事件在命令执行时会触发两次。我想你会克服这个问题的。

虽然此方法不使用 jQuery 绑定，但它对我有用，也可能会解决您的问题。

【讨论】：

【解决方案2】：

如果这对其他人有帮助，这里列出了 tinymce 4 允许的所有事件：

【讨论】：