Question

这是我的代码，

myText.enableKeyEvents = true; // **
myText.on('keyup', function(t){ console.log(t.getValue()); });

它不起作用，我认为它可能有一些调用方法有人有想法吗？

完整代码

// function
var txfJump = function(txf){
    var next = txf.nextSibling();
    if(next.xtype == 'textfield'){
        txf.enableKeyEvents = true;
        txf.on('keyup', function(t, e){
            if(t.getValue().length == t.maxLength){
                next.focus();
            }
        });
        txfJump(next);
    }
};
// form
var p = new Ext.Panel({
    title   : 'test panel',
    width   : 400,
    defaults: {
        xtype : 'textfield',
    },
    items   : [
        { ref : 'one',  maxLength : 5 },
        { ref : 'two',  maxLength : 5 },
        { ref : 'three',maxLength : 5 },
        {
            xtype   : 'button',
            text    : 'SAMPLE'
        },
        { ref : 'four', maxLength : 5 },
    ],
    renderTo: Ext.getBody()
});

Ext.onReady(function(){
    txfJump(p.one);
});

Answer 1

没有黑客技巧就不可能。阅读了TextField的来源，我发现有一个私有方法initEvents，当且仅当 {时才设置html-elements 的回调。已设置{1}}。因此，在调用enableKeyEvents后更改enableKeyEvents无效，直到再次调用它为止。

要注入它，可以尝试触发重新呈现组件，或者可以复制initEvents的{{1}}的相关部分的行为。但似乎没有正式的方式。

Answer 2

您必须致电txf.initEvents()，这需要在txf.enableKeyEvents = true;

之后调用

var txfJump = function(txf){
var next = txf.nextSibling();
if(next.xtype == 'textfield'){
    txf.enableKeyEvents = true;
    txf.initEvents();            //<----- this is what you have missing
    txf.on('keyup', function(t, e){
        if(t.getValue().length == t.maxLength){
            next.focus();
        }
    });
    txfJump(next);
}

Answer 3

在获取新的Ext.form.TextField实例时，应该传递“enableKeyEvents”：true。以下是示例用法

var textField = new Ext.form.TextField({
    . // your configs
    .
    enableKeyEvents: true,
    .
    .
})

在ExtJS中，如何在组件中注入enableKeyEvents = true？

3 个答案: