3

指定された時間から 0 になるまでカウントダウンする単純なタイマーを Javascript で作成したいと思います。完全に機能するこのチュートリアルを見つけました。私の問題は、同じページに複数のタイマーを配置する必要があることです。このチュートリアルでは、グローバル変数を使用しているため、明らかにそれを行いません (私は JS/プログラミングが初めてなので、適切な用語を使用していない可能性があります)。お互いに干渉しないように、各タイマーを独自のオブジェクトとして作成するだけで、同じものを再作成しようとしました。これは私が持っているものです。

function taskTimer(name, startTime) {
  this.timer = name;
  this.totalSeconds = startTime;
  this.tick = function() {
    if (this.totalSeconds <= 0) {
      return;
    }
    this.totalSeconds -= 1;
    this.updateTimer();
    // window.setTimeout("this.tick()", 1000);
  };
  this.updateTimer = function(){
    this.seconds = this.totalSeconds;

    this.hours = Math.floor(this.seconds / 3600);
    this.seconds -= this.hours * (3600);

    this.minutes = Math.floor(this.seconds / 60);
    this.seconds -= this.minutes * (60);

    this.timeString = this.leadingZero(this.hours) + ":" + this.leadingZero(this.minutes) + ":" + this.leadingZero(this.seconds);
    return this.timeString;
  };
  this.leadingZero = function(time){
    return (time < 10) ? "0" + time : + time;
  };
}
var testTimer = new taskTimer("timer", 30);
testTimer.tick();

そこで最後に作成しました。Running はどちらが正しいかを返しますが、runningtestTimer.updateTimer();は値を返しません。コードのその部分には明らかに何か問題があり、私はそれを理解できません。00:00:30testTimer.tick();

4

3 に答える 3

0

私は常に問題を抱えてthisおり、ある例では、関数内で再定義する必要がありました。

this.tick = function() {
  self=this;
  if (self.totalSeconds <= 0) {
    return;
  }
  self.totalSeconds -= 1;
  self.updateTimer();
   // window.setTimeout("self.tick()", 1000);
};

これについての別の投稿があります: var self = this?

于 2013-01-03T20:58:32.950 に答える
0

私のバージョンは、http: //fiddle.jshell.net/hmariod/N7haK/4/で確認できます。 

var tmArray = new Array();
var timerRef, timerId=0;


function newTimer(){
    try{
        if(tmArray.length > 4) throw "Too much timers";
        var countDown = parseInt(document.getElementById("tCountown").value,10);
        if(isNaN(countDown)) throw "tCountown is NaN";
        var tmName = document.getElementById("tName").value;
        var nt = new taskTimer(++timerId, tmName, countDown);
        createTmElement(timerId, tmName);
        tmArray.push(nt);
        if(!timerRef) timerRef = setInterval(timerFn, 1000);
        showTimers();
    }catch(er){
        alert("newTimer:" + er);
    }
}

function taskTimer(id, name, tCountown) {
    this.id = id;
    this.tName = name;
    this.tCountown = tCountown;
}


function timerFn(){
    try{
        var i;
        killTimer = true;
        for(i = 0; i < tmArray.length; i++){
           tmArray[i].tCountown--;
            if(tmArray[i].tCountown < 0){
                tmArray[i].tCountown = 0;
            }else{
                killTimer = false;
            }
        }
        if(killTimer) clearInterval(timerRef);
        showTimers();
    }catch(er){
        clearInterval(timerRef);
        aler("timerFn: " + er);
    }
}
于 2013-01-04T01:24:24.607 に答える