0

数値を含む div 要素があります。これは、現在のゲームがプレイされている分:秒の数に対応します。ゲームの解決に費やした時間を示すランニングカウンターにしたいと思います。

4

4 に答える 4

2

私はあなたが望むならあなたが働くことができる機能的なフィドルを持っています：

http://jsfiddle.net/nicholas_eden/zaRqQ/

HTML：

<span id="elapsed">0:00</span>;​

Javascript：var $ elapsed = $（'＃elapsed'）;

var start = new Date().getTime();


function updateTime() {
  var now = new Date().getTime();
  var elapsed = now - start;
  var formatted = secondsToTime(elapsed/1000);
  $elapsed.html(formatted.h + ':' + formatted.m + ':' + formatted.s);
  setTimeout(updateTime, 1000);
}


function secondsToTime(secs) {
  var hours = Math.floor(secs / (60 * 60));

  var divisor_for_minutes = secs % (60 * 60);
  var minutes = Math.floor(divisor_for_minutes / 60);

  var divisor_for_seconds = divisor_for_minutes % 60;
  var seconds = Math.ceil(divisor_for_seconds);

  if (minutes < 10) {
    minutes = '0' + minutes;
  }

  if (seconds < 10) {
    seconds = '0' + seconds;
  }

  var obj = {
    "h": hours,
    "m": minutes,
    "s": seconds
  };
  return obj;
}

updateTime();​

これは、初期時間を取得するアプローチを取り、その後、毎秒、現在の時間と初期時間の差を計算します。次に、それをより読みやすい形式に解析します。

于 2012-12-13T05:18:56.203 に答える
2

私は何よりもまずあなたを正しい方向に向けようとします-あなたが自分でタスクを完了することができれば（ガイダンスはありますが）、あなたは常にもっと多くを学ぶでしょう。それでも問題が解決しない場合は、コメントしてください。コードベースの回答を提供させていただきます。

2つの変数を追跡します：totalSecondsとtotalMinutes。1を-に加算し、その数が60に達すると、1を加算して0にリセットする、毎秒実行される関数（JavaScriptのsetIntervalメソッドを使用して実行できます）を記述します。totalSecondstotalMinutestotalSeconds

つまり、2つの変数に含まれるものは次のとおりで、毎秒変更されます。

totalSeconds <- 0
totalMinutes <- 0

totalSeconds <- 1
totalMinutes <- 0

totalSeconds <- 2
totalMinutes <- 0

...

totalSeconds <- 59
totalMinutes <- 0

totalSeconds <- 0
totalMinutes <- 1

totalSeconds <- 1
totalMinutes <- 1

totalSeconds <- 2
totalMinutes <- 1

...

これらの2つの変数を更新した後、変更を表すようにdivのinnerHTMLプロパティを変更します。

頑張ってください！

于 2012-12-13T04:38:52.057 に答える
0

HTMLで

<div id="countdown" onload="countDown(10:20)"> 10:20 </div>

JSで

function countDown(time) { 
    cmin2=time.split(":")[0];
    csec2=time.split(":")[1];
    down=setInterval(function(){DownRepeat();},1000);
}

unction DownRepeat() { 
    csec2--;        
    if(csec2==-1) { 
        csec2=59; cmin2--; 
    }

    if ((cmin2 == 0) && (csec2 == 0)) {
         clearInterval(down);
     //do ur action after finish count down
    }   
    document.getElementById("countdown").innerHTML = cmin2 + ";" + csec2; 
}
于 2012-12-13T04:50:51.473 に答える
0

カウンターを Iframe に保持し、Iframe を 0.5 秒または 1 秒ごとに更新して、「ゲーム」は実行し続けますが、Iframe は更新されたカウンターを毎秒表示します。(私は 2 番目よりも近くに行きません)

-S

于 2014-04-07T20:08:56.413 に答える