0

我需要显示一个倒数计时器，使用延迟任务实现它。代码如下：

var task = Ext.create('Ext.util.DelayedTask', function() {

if (sec < 1 && min > 0) {
    min--;
    sec = 60;
}
if (min == 0 && sec == 1) {
    task.cancel();
}
sec--;
Ext.getCmp('minute').setHtml(min);
Ext.getCmp('second').setHtml(sec);
console.log('minute is' + min + 'second is' + sec);

task.delay(1000);

}, this);

task.delay(1000);

通过上面的实现，函数只被调用一次。看看这个线程 Auto Refresh the List in Sencha Touch Application的讨论，上面的代码应该可以工作。但是，它不起作用。我的代码可能有什么问题？谢谢。

4

2 回答 2

1

据我所知， Ext.util.DelayedTask 用于延迟任务而不执行它。正如您在文档中看到的那样，这对于延迟表单上的 Ajax 调用很有用：

此方法对于检测用户是否已在文本字段中完成输入等事情特别有用。[..]您可以使用此类将按键事件缓冲一定的毫秒数，并且仅在它们停止该时间量时才执行。

为什么不直接使用常规的 setTimeout？像http://jsfiddle.net/EreaP/这样的东西可以完美运行。

于 2012-06-20T08:41:15.953 回答
0

迟到的回应：

Ext.define('MyApp.view.TimerClock', {
    extend: 'Ext.Container',
    xtype: 'timerClock',
    duration: 3 * 60 * 60, //default to 3 hour
    paused: false,
    clockIntervalHook: undefined,
    config: {
        listeners: {
            initialize: function () {
                this.start();
            }
        }
    },
    start: function () {
        var me = this,
            duration = me.duration,
            updateClock = function () {
                if (me.isPaused()) {
                    return;
                }
                me.setHtml(me.formatTime(duration--));
                if (duration <= 0) {
                    me.stop();
                }
            };
        me.clockIntervalHook = setInterval(updateClock, 1000);
        return me;
    },

    pause: function () {
        this.paused = true;
        return this;
    },

    isPaused: function () {
        return this.paused == true
    },

    resume: function () {
        this.paused = false;
    },

    restart: function () {
        this.stop();
        this.start();
    },

    stop: function () {
        clearInterval(this.clockIntervalHook);
        return this;
    },

    //format the given seconds into "HH:MM:SS" format
    //override this if you need custom behavior
    formatTime: function (seconds) {
        var hours = Math.floor(seconds / 3600);
        hours = hours <= 9 ? "0" + hours : hours;
        seconds %= 3600;
        var minutes = Math.floor(seconds / 60);
        minutes = minutes <= 9 ? "0" + minutes : minutes;
        seconds %= 60;
        seconds = seconds <= 9 ? "0" + seconds : seconds;
        return hours + ":" + minutes + ":" + seconds
    }
});

任何其他视图，只需使用添加计时器

{ xtype : 'timerClock' }
于 2014-07-07T19:26:44.827 回答