`

sencha touch 表单组件监听软键盘事件

阅读更多

用Ext.form.Panel做表单时,经常会专门添加一个提交按钮来响应用户的提交操作。但这样设计,从用户体验来讲,用户在输入完信息后,需要手动关闭键盘,再添加提交按钮,非常不方便,如果我们能监听到系统软件盘的提交按钮事件就可以判断用户提交操作,提升用户体验。

监控方法如下:

{
	xtype : 'textfield',
	listeners : {
                // 监控键盘事件
		'keyup' : function(text, e, eOpts){
                        // 过滤特殊字符
			text.setValue(text.getValue().replace(/[^\d\w\u0020\u4E00-\u9FA5]/g,''));
			if(e.event.keyIdentifier == 'Enter'){   // 标识软件盘提交按钮
				text.up('#_SearchResult').search();// 执行对应的提交操作
			}
		}
	}
}

Ext.form.field中的其他组件也可采用此方式进行软件盘事件监控

分享到:
评论

相关推荐

    Sencha Touch的表单组件

    Sencha Touch的表单组件

    sencha touch动态加载组件

    这可以通过配置Store的proxy来实现,如设置`autoLoad: false`并监听`scroll`事件来触发加载更多操作。 4. **使用Ext.navigation.View**:这是一个专门为导航设计的组件,可以管理一个视图堆栈。每次导航到新的页面...

    touch-docs-2.2.1.zip(senchaTouch 离线API参考文档)

    Sencha Touch 是一款专为移动设备开发的前端框架,它提供了丰富的组件和API,使得开发者可以轻松构建跨平台的触控应用。这个压缩包“touch-docs-2.2.1.zip”包含了Sencha Touch 2.2.1版本的离线API参考文档,对于...

    sencha touch list demo

    5. **事件监听** List组件有许多内置的事件,如`itemtap`、`itemdoubletap`、`itemswipe`等,开发者可以通过监听这些事件来实现用户交互后的相应操作,比如导航到详情页面或者执行其他业务逻辑。 6. **App.js** ...

    sencha touch 登陆界面

    控制器是Sencha Touch应用的核心部分,它监听视图中的事件(如按钮点击),然后执行相应的动作(Action)。在登录场景中,控制器会监听登录按钮的点击事件,获取输入框的值,然后调用模型的同步方法,将数据发送到...

    Sencha 和 Sencha Touch 简介

    它基于 HTML5 和 CSS3 的 web 标准,全面兼容 Android 和 Apple iOS,通过 Sencha Touch 框架用户可以创建非常像移动设备本地应用的 web 应用,它提供了丰富的华丽的控件和强大的功能,包括对触控事件的增强,数据...

    sencha touch2 ajax 获取数据

    Sencha Touch2是一个用于构建高性能、跨平台的移动应用的JavaScript库,它专注于触摸设备上的用户体验,提供了一系列丰富的UI组件和工具,使得开发者能够快速地创建出美观且功能强大的移动应用。 ### Sencha Touch2...

    sencha touch项目源码

    Sencha Touch 是一款专为移动设备设计的前端框架,它提供了丰富的组件和API,用于构建交互式的、响应式的Web应用程序。这个项目源码是基于Sencha Touch开发的一个实例,通过研究这个项目,我们可以深入理解Sencha ...

    Sencha Touch in Action

    3. 用户界面组件:详细介绍Sencha Touch提供的各种用户界面组件,如按钮、列表、表单、滑动菜单等。 4. 应用结构与生命周期:解释如何组织Sencha Touch应用代码,以及应用的生命周期管理。 5. 触摸事件处理:讲解在...

    Sencha Touch 2 简介+组件+布局

    Sencha Touch 2 简介知识,环境搭建,组件介绍和布局事例

    Sencha Touch开发的项目《般若人生》源码

    通过分析这些文件,我们可以学习到如何组织一个Sencha Touch项目,如何利用其组件和数据管理机制,以及如何优化应用的性能和用户体验。对于想要深入理解Sencha Touch框架或者提高移动Web开发技能的开发者来说,...

    sencha-touch-1.0.1a.zip_Sencha Touch _sencha touch api_touch

    Sencha Touch 的核心在于提供一套丰富的组件(Components),包括表格、按钮、面板、表单等,这些组件都是针对触摸操作优化的。通过这些组件,开发者可以快速地搭建出交互性强、用户体验良好的移动应用界面。同时,...

    sencha touch中文翻译文档

    6. **动画与触摸事件**:阐述Sencha Touch如何支持触摸事件和流畅的动画效果,以提升移动设备上的用户体验。 7. **主题与皮肤**:讨论如何定制和应用Sencha Touch的主题,以适应不同的设计风格和品牌需求。 8. **...

    sencha touch 2.4.0最新版

    6. **触摸事件**:Sencha Touch专门针对触摸设备进行了优化,2.4.0版本可能对触摸事件处理进行了优化,提升了手势识别的准确性和稳定性。 7. **国际化与本地化**:为了满足全球用户的需求,2.4.0版本可能增强了国际...

    senchaTouch和fusioncharts结合的实例

    Sencha Touch 和 FusionCharts 的结合使用,是一种在移动设备上创建交互式图表和图形的高效方式。Sencha Touch 是一个流行的JavaScript框架,专门用于构建触摸优化的移动Web应用程序,而FusionCharts则是一款强大的...

    一个完整的sencha touch 应用案例

    Sencha Touch 是一款专为移动设备设计的前端框架,它提供了丰富的组件库和强大的数据管理功能,用于构建高性能的触控应用。这个压缩包文件包含了创建一个完整的Sencha Touch 应用所需的基本元素,让我们逐一解析这些...

    Sencha Touch2环境搭建

    4. **Sencha CMD** - 安装Sencha CMD,它是Sencha Touch开发的核心工具,提供了一系列自动化命令,如创建项目、生成组件、编译代码等。可以通过Sencha官网下载并按照指导进行安装。 接下来,我们将按照以下步骤搭建...

    sencha touch在VScode上的插件

    Sencha Touch 是一款用于构建移动应用的前端框架,它提供了丰富的组件库和强大的数据管理功能,使得开发者可以创建交互性强、性能优异的触屏应用程序。VSCode(Visual Studio Code)是微软开发的一款广受欢迎的源...

    Sencha Touch MVC 模式

    ### FrancisShanahan-SenchaTouch2MVCHelloworld-c330be1项目 该项目是一个基于Sencha Touch 2的MVC模式Hello World示例,可能包含了创建基本模型、视图、控制器的过程,演示了如何通过MVC模式构建一个简单的应用。...

Global site tag (gtag.js) - Google Analytics