仅在显示 window 时处理点击

Processing clicking only when show window

我是单击按钮,当单击键盘上的 "ENTER" 时,但我只想在显示 window ('MyDesktop.Books') 时处理单击。但是当我显示 window,然后关闭它,当我点击"ENTER",window('MyDesktop.Books')再次出现。

操作方法:仅在显示window时处理在键盘上单击"ENTER" 代码:

Ext.define('MyDesktop.Books', {
extend: 'MyDesktop.BaseWindow',
id: 'books-win',
title: 'Book',
width: 700,
height: 400,
iconCls: 'small',
layout: 'fit',
items: [
    {
        xtype: 'bookwrap',
        listeners: {
            afterrender: function() {
                var mapEnterNew = new Ext.KeyMap(document, {
                    key: 13,
                    fn: function(e) {
                        Ext.ComponentQuery.query('bookwrap button[name=createbook]')[0].getEl().dom.click();
                    }
                });

            }
        }
    }
],

});

我认为你应该只在需要显示时初始化 window 然后删除,或者在 field/form focus and remove it on blur.

中附加事件

如果我知道 xtype: "bookwrap" 是什么,我可以给出更好的答案/示例。

你真的不需要使用 getEl().dom.click(),ExtJs 可以用它的内置组件处理你所有的表单提交需求,你可以在你的控制器中使用 refs 来更容易地引用你的按钮.

此代码在渲染上附加关键事件处理,并在 window 为 closed/hidden 时再次将其删除:

还有一个Fiddle.

Ext.application({
    name: 'Fiddle',

    launch: function() {
        Ext.define('Books', {
            extend: 'Ext.window.Window',
            id: 'books-win',
            title: 'Book',
            width: 700,
            height: 400,
            iconCls: 'small',
            layout: 'fit',
            items: [{
                xtype: 'panel',
                html: 'test'
            }],
            listeners: {
                beforehide: function() {
                    this.mapEnterNew.destroy();
                },
                afterrender: function() {
                    this.mapEnterNew = new Ext.KeyMap(document, {
                        key: 13,
                        fn: function(e) {
                            console.log(e);
                            Ext.ComponentQuery.query('bookwrap button[name=createbook]')[0].getEl().dom.click();
                        }
                    });
                }
            }
        });

        Ext.create('Books').show();
    }
});