zoukankan      html  css  js  c++  java
  • ExtJS监听键盘事件:回车键实现登录功能

          ExtJS为我们封装了完整的键盘监听事件,我们只要调用相应的接口就能完美的实现键盘监听。在所有的键盘事件中,按回车键提交表单,实现登 录的功能是我们最常用到的键盘监听事件,下面李坏给出一个实现回车键提交表单的案例,希望能给ExtJS的新手朋友们提供帮助。
          首先,我们定义一个表单,代码如下:

    Ext.define('Demo.view.Viewport', {
        extend: 'Ext.container.Viewport',
        items:[{
            xtype: 'form',
            title: 'ExtJS监听键盘事件',
             500,
            height: 400,
            margin: '100 0 0 200',
            defaults:{
                xtype: 'textfield',
                 300,
                labelWidth: 120,
                margin: '20 0 0 30'
            },
            items:[{
                fieldLabel: '用户名',
                name: 'username'
            },{
                fieldLabel: '密  码',
                name: 'password',
                inputType: 'password',
                //改配置项必须设置为true,默认false
                enableKeyEvents: true
            }],
            bbar:[{
                text: '登录',
                action: 'login'
            },{
                text: '重置',
                action: 'reset'
            }]
        }]
    });

    然后,对密码框设置监听事件,代码:

    Ext.define('Demo.controller.Controller', {
        extend: 'Ext.app.Controller',
        init:function(){
            this.control({
                'viewport > form textfield[name=password]':{
                    keypress: this.userLogin
                }
            })
        },
        userLogin:function(b,e,eOpts){
            //e.getKey()是获取按键的号码,13代表是回车键
            if(e.getKey() == 13){
                Ext.Msg.alert('提示','您已经按下了回车键,可以在这里提交表单做登录操作了... ...')
            }
        }
    });

    ExtJS键盘事件详解:
          1.首先要将需要监听的输入框设置为允许使用键盘事件(enableKeyEvents: true),否则键盘事件不可用;
          2.使用getKey()方法判断按键是否为自己设置的按键,具体按键号码可参照ExtJS给出的api,然后做具体操作。

    文章来源:ExtJS学习

  • 相关阅读:
    素数路径Prime Path POJ3126 素数,BFS
    Fliptile POJ3279 DFS
    Find the Multiple POJ1426
    洗牌Shuffle'm Up POJ3087 模拟
    棋盘问题 POJ1321 DFS
    抓住那只牛!Catch That Cow POJ3278 BFS
    Dungeon Master POJ2251 三维BFS
    Splitting into digits CodeForce#1104A
    Ubuntu下手动安装Nvidia显卡驱动
    最大连续子序列和
  • 原文地址:https://www.cnblogs.com/itleeblog/p/3274622.html
Copyright © 2011-2022 走看看