文档章节

Sencha Touch实现按钮点击倒计时

Geomen
 Geomen
发布于 2015/01/14 12:37
字数 297
阅读 750
收藏 0

首先发送一个AJAX请求到服务器,返回结果如果正确才开始倒计时(其它代码省略):

var me = this;
Ext.Ajax.request({
    url: 'account/getCode',
    params:{
        phone: phone
    },success:function(response){
        var text = Ext.decode(response.responseText); //这是返回结果
        var task = Ext.create('Ext.util.DelayedTask',function(){
            me.updateClock(120); //设置120秒的倒计时时间
        });
        task.delay(1000); //一秒后执行调用updateClock函数
    },failure:function(){
        Ext.Msg.alert('请求服务器失败,请检查网络');
    }
});

这是updateClock函数:

updateClock:function(num){
    var me = this;
    Ext.getCmp('get_auth_code').setText(num-1); //获取验证码按钮的ID并设置text值
    var task = Ext.create('Ext.util.DelayedTask',function(){
        me.updateClock(num-1); //调用updateClock函数本身
    });
    if(num <= 1){
        task.cancel(); //当倒数到0时停止
    }else{
        task.delay(1000); //一秒后再调用updateClock函数本身
    }
}

这样就实现了点击按钮后AJAX提交后开始倒数。同理,如果要点击按钮直接倒数可以在按钮的点击事件触发时,运行:

var task = Ext.create('Ext.util.DelayedTask',function(){
            me.updateClock(120); //设置120秒的倒计时时间
        });
        task.delay(1000); //一秒后执行调用updateClock函数

就可以了!

© 著作权归作者所有

Geomen
粉丝 21
博文 46
码字总数 13481
作品 0
厦门
程序员
私信 提问
构建基于 Sencha Touch 框架的 Mobile web 应用

Sencha Touch 是第一个专门设计为移动设备开发 web 应用的 JavaScript 框架,它基于 HTML5 和 CSS3 的 web 标准,全面兼容 Android 和 Apple iOS,通过 Sencha Touch 框架用户可以创建非常像...

IBMdW
2011/09/20
1K
0
用 Sencha Touch 构建移动 web 应用程序

Sencha Touch 是一个使用 HTML5、CSS3 和 JavaScript 语言构建的移动 web 应用程序框架,在本文中,学习如何应用您当前的 web 开发技能进行移动 web 开发。下载和建立 Sencha Touch,通过一个...

IBMdW
2012/03/19
1K
0
Extjs学习(3):事件和动作

什么是事件? 事件+监听对象 Ext.create('Ext.Panel', { html: 'My Panel', renderTo: Ext.getBody(), listeners: { afterrender: function() { Ext.Msg.alert('We have been rendered'); } ......

储明城
2016/02/18
274
1
Ext JS 5 对平板的支持

Ext JS 已经被公认为桌面web应用的领衔框架. 计算机应用市场,无论是在个人还是企业领域,都因为平板开始挑战全球个人PC的销售量而变得云诡波谲起来. Sencha 认识到了这种变化,并在其 Ext ...

oschina
2014/07/30
4.8K
17
使用 Sencha Touch 开发超炫的跨平台移动 Web 应用

Sencha Touch 是由 Sencha 公司开发的移动 Web 应用开发框架,用以提升主流移动设备在浏览器上的触碰操作,增强用户体验。该框架以久负盛名的 Ext JS 富客户端框架为基础,并支持最新的 HTML...

IBMdW
2011/08/04
4K
0

没有更多内容

加载失败,请刷新页面

加载更多

家庭作业——苗钰婷

2 编写一个程序,发出一声警报,然后打印下面的文本: Startled by the sudden sound, Sally shouted, "By the Great Pumpkin, what was that! #include<stdio.h>int main(){......

OSC_Okruuv
10分钟前
1
0
经典系统设计面试题解析:如何设计TinyURL(一)

原文链接: https://www.educative.io/courses/grokking-the-system-design-interview/m2ygV4E81AR 编者注:本文以一道经典的系统设计面试题:《如何设计TinyURL》的参考答案和解析为例,帮助...

APEMESH
11分钟前
1
0
2.面向对象设计原则(7条)

开闭原则 开闭原则的含义是:当应用的需求改变时,在不修改软件实体的源代码或者二进制代码的前提下,可以扩展模块的功能,使其满足新的需求。 实现方法 可以通过“抽象约束、封装变化”来实...

Eappo_Geng
14分钟前
1
0
8086汇编基础 debug P命令 一步完成loop循环

    IDE : Masm for Windows 集成实验环境 2015     OS : Windows 10 x64 typesetting : Markdown    blog : my.oschina.net/zhichengjiu    gitee : gitee.com/zhichengjiu   ......

志成就
18分钟前
1
0
使用nodeJS实现前端项目自动化之项目构建和文件合并

本文转载于:专业的前端网站➜使用nodeJS实现前端项目自动化之项目构建和文件合并 前面的话   一般地,我们使用构建工具来完成项目的自动化操作。本文主要介绍如何使用nodeJS来实现简单的项...

前端老手
31分钟前
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部