extjs - 捕捉 ExtJS 4 中 HtmlEditor 内容的变化

Question

每当用户更改 ExtJS 4 中的 HtmlEditor 的内容时，我都想捕获。我尝试了同步、更改和推送事件，但都没有成功。只要获得焦点，似乎就会触发同步，但不会触发更改，而且我不知道是什么原因导致推送被触发。

谁能知道当用户更改 HtmlEditor 的内容时触发了哪个事件？

谢谢

编辑:我已经尝试了以下对我不起作用的代码，有什么想法吗？

init: function() {
    this.control({
        'htmleditor[name="reportHtmlEditor"]': {
            render: this.addKeyHandler
        }
    });
},

addKeyHandler: function(field) {
    // This gets called fine on the component render
    var el = field.textareaEl;
    if (Ext.isGecko) {
        el.on('keypress',
        function() {
            // Do Stuff, which never gets called
        }, this, { buffer: 100});
    }
    if (Ext.isIE || Ext.isWebKit || Ext.isOpera) {
        el.on('keydown',
        function() {
            // Do Stuff, which never gets called
        }, this, { buffer: 100});
    }
},

有关更多信息，我正在使用 Firefox 对此进行测试，我从 this 获得了其他信息。发布。

Answer 1

看起来有用于编辑源代码的文本区域。与 html 中的任何其他字段一样，此字段仅在模糊后触发更改事件(HtmlEditor 似乎依赖于此事件)。您可能应该绑定(bind)到其他事件，例如 keydown 然后根据按下的键，触发适当的事件。您可以在渲染处理程序中执行此操作:

{
    xtype: 'htmleditor',
    listeners: {
        render: function(){
            this.textareaEl.on('keydown', function() {
                this.fireEvent('sync', this, this.textareaEl.getValue());
            }, this, { buffer: 500 });
        },
        sync: function(sender, html){
            debugger;
        }
    }
}