EXTjs字段容器焦点事件未触发

Question

我正在尝试让它在Sencha fiddle中工作。

Ext.application({
    name: 'Fiddle',

    launch: function() {

        Ext.create('Ext.form.Panel', {
            title: 'FieldContainer Example',
            width: 550,
            bodyPadding: 10,


            items: [{
                xtype: 'fieldcontainer',
                fieldLabel: 'Last Three Jobs',
                labelWidth: 100,
                listeners: {
                    focus: function(fld, e, opts) {
                        alert("onFocus");
                    }
                },

                // The body area will contain three text fields, arranged
                // horizontally, separated by draggable splitters.
                layout: 'hbox',
                items: [{
                    xtype: 'textfield',
                    flex: 1
                }, {
                    xtype: 'splitter'
                }, {
                    xtype: 'textfield',
                    flex: 1
                }, {
                    xtype: 'splitter'
                }, {
                    xtype: 'textfield',
                    flex: 1
                }]
            }],
            renderTo: Ext.getBody()
        });
    }
});

Answer 1

您需要将焦点侦听器附加到文本字段上，而不是附加到字段容器上，因为它没有获得焦点。

items: [{
                    xtype: 'textfield',
                    flex: 1,
                    listeners: {
                        focus( a, event, eOpts ){
                            alert("onFocus");
                        }
                    },
                }, {
                    xtype: 'splitter'
                }, {
                    xtype: 'textfield',
                    flex: 1
                }, {
                    xtype: 'splitter'
                }, {
                    xtype: 'textfield',
                    flex: 1
                }]

工作代码here

希望这能有所帮助！