ExtJs 5-捕獲Ext.ux.IFrame的keydown事件

Question

在我的ExtJs 5應用程序中，我使用Ext.ux.IFrame -component來顯示來自內部網的新聞html文檔。 當我按Backspace鍵或alt +向左/向右鍵時，瀏覽器的歷史記錄導航會觸發，並且應用程序會加載新的。

為了防止iframe以外的行為，我在文檔中附加了一個keydown偵聽器

Ext.onReady(function () {
    var documentObj = Ext.getDoc();
    documentObj.on('keydown', globalKeyDown);
});

在回調中，我停止了這些事件

globalKeyDown: function (event, targetDomEle) {
    var eventKey = event.getKey();

    switch (eventKey) {
        case event.BACKSPACE:
            if ((!/^input$/i.test(targetDomEle.tagName) &&
                    !/^textarea$/i.test(targetDomEle.tagName)) ||
                    targetDomEle.disabled || targetDomEle.readOnly) {
                event.stopEvent();
            }
            break;
        case event.LEFT:
        case event.RIGHT:
            if (event.altKey) {
                event.stopEvent();
            }
            break;
    }
}

但是，當我嘗試對iframe執行相同操作時，ExtJs框架偵聽它的方法無法正常工作。

Ext.application({
    name: 'Test',
    requires: ['Ext.ux.IFrame'],
    launch : function() {

        var info = new Ext.Component({
            renderTo: document.body,
            html: 'above the iframe',
            width: 350,
            padding: '0 0 20 0',
            margin: '0 0 1 0',
            style: { border: 'solid 1px blue' },
        });

        var iframe = Ext.create('Ext.ux.IFrame',{
            style: { border: 'solid 1px red' },
            width: 350,
            height: 350,
            renderTo: document.body
        });

        var iframeDoc  = iframe.getDoc();
        var iframeDocEl = Ext.get(iframeDoc);

        iframeDocEl.on('keydown', function(){
            console.log('iframeDoc.on callback'); // <-- never executed
        });

        iframeDoc.onkeyup = function(){
            console.log('onkeyup callback') // <-- works just fine
        };
    }
});

為什么iframeDocEl.on('keydown', ...在這種情況下iframeDoc.onkeyup ？ iframeDoc.onkeyup方法只是一種解決方法，因為在回調中，我想使用框架事件對象與跨瀏覽器兼容（IE8 +）。

感謝您的每一個建議。

小提琴可以在Sencha小提琴中找到。

Answer 1

Ext.ux.Iframe源不包含從iframe本身觸發的事件。 因此它不支持此功能。 前一段時間有一個ManagedIframe項目，它提供了許多功能，但僅在ExtJS 3中受支持。

值得在Sencha論壇上進行搜索，看看是否有人試圖更新此擴展以使其與ExtJS 5兼容。