我正在尝试开发一个密码面板。当面板被激活时,我希望第一个字段被聚焦/激活,当输入一个数字时,进入下一个字段,然后提交最后一个。这应该感觉类似于 iPhone/Android 锁屏。
我已经尝试了几个小时,但无法解决。看起来很简单!非常感谢您的帮助。
Ext.define('MyApp.view.PinPanel', {
extend: 'Ext.form.Panel',
alias: 'widget.pinpanel',
config: {
centered: true,
height: '100px',
width: '300px',
hideOnMaskTap: true,
layout: {
type: 'hbox'
},
modal: true,
items: [
{
xtype: 'numberfield',
margin: '0 10 0 0',
width: 50,
clearIcon: false,
name: 'pin0',
tabIndex: 1
},
{
xtype: 'numberfield',
margin: '0 10 0 0',
width: 50,
clearIcon: false,
name: 'pin1',
tabIndex: 2
},
{
xtype: 'numberfield',
margin: '0 10 0 0',
width: 50,
clearIcon: false,
name: 'pin2',
tabIndex: 3
},
{
xtype: 'numberfield',
width: 50,
clearIcon: false,
name: 'pin3',
tabIndex: 4
}
]
}
});