javascript - TinyMCE 撤消操作不会触发更改事件

Question

不确定是否有人在使用您的 TinyMCE 时遇到过这个问题。我有一个更改事件处理程序，它更改另一个元素的值。请参阅下面的初始化代码:

/** Initialize TinyMCE inline editor for headline text */
tinymce.init({
    selector: ".editable.headline",
    paste_as_text: true,
    inline: true,
    toolbar: "undo redo",
    menubar: false,
    verify_html: false,
    font_formats: "MuseoSans = sans-serif;",
    setup: function(ed) {
        var text = '';
        var wordlimit = 200;
        /** handler for keydown event to prevent < 200 character limit */
        ed.on('keydown',function(e) {
            text = ed.getContent().replace(/(< ([^>]+)<)/g, '');
            wordcount = wordlimit - (text.length);
               if(wordcount <= 0 && e.keyCode != 8) {
                    e.preventDefault();
                    e.stopPropagation();
                    return false;
               }
        });
        /** handler for headline text changes */
        ed.on('change',function(e) {
            var content = tinyMCE.get(ed.id).getContent();
            var escapedClassName = ed.id.replace(/(\[|\])/g, '\\$&');
            $('.'+escapedClassName).html(content);

        });
   }
});

当我键入/粘贴文本时，change 事件会正确触发，但是当我撤消文本更改时，change 事件不会正确触发。

关于如何在撤消和重做事件上强制触发 change 事件有什么想法吗？

如有任何帮助，我们将不胜感激!

Answer 1

内容不是很容易找到，但是 TinyMCE 网站确实描述了一个列表 events that are fired during the course of the editor's lifecycle并解释这些事件何时触发。

在您的场景中，只需将redo 和undo 事件添加到on setup 中的函数调用功能。

setup: function (ed) {
    ed.on('change redo undo',function(e) {
        var content = tinyMCE.get(ed.id).getContent();
        var escapedClassName = ed.id.replace(/(\[|\])/g, '\\$&');
        $('.'+escapedClassName).html(content);
    });
}