0

秒を表示するこのjavascriptカウントダウンがあります。2番目ではなくカウンターで日を表示する方法を知る必要があります。

つまり、1日、残り2時間です。

これはコードです：

    <script type="text/javascript">
var MAX_COUNTER = 1000;
var counter = null;
var counter_interval = null;

function setCookie(name,value,days) {
    var expires;
    if (days) {
        var date = new Date();
        date.setTime(date.getTime()+(days*24*60*60*1000));
        expires = "; expires="+date.toGMTString();
    }
    else {
        expires = "";
    }
    document.cookie = name+"="+value+expires+"; path=/";
}

function getCookie(name) {
    var nameEQ = name + "=";
    var ca = document.cookie.split(';');
    for(var i=0;i < ca.length;i++) {
        var c = ca[i];
        while (c.charAt(0) == ' ') {
            c = c.substring(1,c.length);
        }
        if (c.indexOf(nameEQ) === 0) {
            return c.substring(nameEQ.length,c.length);
        }
    }
    return null;
}

function deleteCookie(name) {
    setCookie(name,"",-1);
}

function resetCounter() {
    counter = MAX_COUNTER;
}

function stopCounter() {
    window.clearInterval(counter_interval);
    deleteCookie('counter');
}

function updateCounter() {
    var msg = '';
    if (counter > 0) {
        counter -= 1;
        msg = counter;
        setCookie('counter', counter, 1);
    }
    else {
        counter = MAX_COUNTER;

    }
    var el = document.getElementById('counter');
    if (el) {
        el.innerHTML = msg;
    }
}

function startCounter() {
    stopCounter();
    counter_interval = window.setInterval(updateCounter, 1000);
}

function init() {
    counter = getCookie('counter');
    if (!counter) {
        resetCounter();
    }
    startCounter();
}

init();
</script>

現時点では秒のみが表示され、0に達すると自動的に再起動します。

4

3 に答える 3

2 
http://jsfiddle.net/h2DEr/1/

function updateCounter() {
    var msg = '';
    if (counter > 0) {
        counter -= 1;
        msg = convertSecondsToDays(counter); 
        setCookie('counter', counter, 1);
    }
    else {
        counter = MAX_COUNTER;
    }
    var el = document.getElementById('counter');
    if (el) {
        el.innerHTML = msg;
    }
}

これが秒を日数に変換する関数です

function convertSecondsToDays(sec) {
  var days, hours,rem,mins,secs;
  days =  parseInt(sec/(24*3600));
  rem = sec - days*3600
  hours = parseInt(rem/3600);
  rem = rem - hours*3600;
  mins = parseInt(rem/60);
  secs = rem - mins*60;
  return days +" days " + hours +" hours "+mins + " mins "+ secs + " seconds";
}

更新： @sanya_zolの回答とDavidSmithからのコメントの後

setIntervalは毎秒実行されることは想定されていないため、戦略を少し変更する必要があります。そのためのフィドルも変更しました

  1. 期限切れにする場合は、MAX_COUNTERを値に設定します。

  2. カウンターを-1減らす代わりに、現在の時刻を確認し、有効期限から減算して表示します。

      EXPIRY_SECONDS = 24*60*60;
  MAX_COUNTER = parseInt(new Date().getTime()/(1000)) + EXPIRY_SECONDS;

  function updateCounter() {
     var msg = '',curTime = parseInt(new Date().getTime()/1000);

     if (curTime < MAX_COUNTER) {
        msg = convertSecondsToDays(MAX_COUNTER- curTime);
        setCookie('counter', MAX_COUNTER- curTime, 1);
     }
     else {
        MAX_COUNTER = parseInt(new Date().getTime()/1000) + EXPIRY_SECONDS;
     }

     var el = document.getElementById('counter');
     if (el) {
       el.innerHTML = msg
     }
   }
于 2013-03-26T11:00:28.957 に答える
0 
counter_interval = window.setInterval(updateCounter, 1000);

1000はミリ秒単位の値なので、1日に何ミリ秒ありますか？

counter_interval = window.setInterval(updateCounter, 1000*60*60*24);
于 2013-03-26T10:28:29.463 に答える
0

vduaの答えに加えて：

あなたのコードは本当にひどく書かれています。

カウンターが正確ではないsetIntervalを使用します（さらに、非常に非常に悪い精度があります）-したがって、カウンターの秒は1.05〜1.2実秒に等しくなります（リアルタイムとカウンターの差が累積されます）。

正確なカウンターを取得するには、システム時刻を（（new Date）.getTime（）を介して）より低い間隔（100ミリ秒など）で毎回チェックする必要があります。

于 2013-03-26T11:03:35.807 に答える