自动进度条

时间:2013-07-02 10:25:24

标签: javascript qooxdoo

我是qooxdoo的新手,我正在尝试创建一个自动进度条,用于“搜索”功能。

它似乎在“setTimeout”函数之前停止,因此它不会更改其值

我正在使用的代码(弹出窗口是带有VBox布局的弹出窗口):

var bar=new hello.automaticProgressBar();
bar.delayedLoop();
popup.add(bar);

我的automaticProgressBar.js:

qx.Class.define("hello.automaticProgressBar",
{
  extend : qx.ui.indicator.ProgressBar,

    construct : function()
    {
      this.base(arguments); 
        //var i = 1;

    },
members:{
    i:1,
    delayedLoop : function()
    {
        setTimeout(function ()
        {  
            this.setValue(10*this.i);
            this.i++;                  
            if (this.i < 11)
            {
                alert(this.i);
                this.delayedLoop();         
        }                      
    }, 300)
    }
}
});

有什么猜测吗?

2 个答案:

答案 0 :(得分:2)

您需要将setTimeout的函数参数的上下文更改为当前实例:

setTimeout(function () {  
  this.setValue(10*this.i);
  this.i++;                  
  if (this.i < 11) {
    alert(this.i);
    this.delayedLoop();         
  }                      
}.bind(this), 300);

答案 1 :(得分:1)

我认为主要罪魁祸首是内置的setTimeout,它失去了与本地this的连接。我用qx.event.Timer.once替换它,它就像一个魅力。请参阅此Playground sample中的代码。按Playground的“Log”按钮查看日志消息。