javascript - 自動調整 JavaScript カウントダウン

Question

カウントダウン タイマーが 0 になると自動的に別のカウントダウンに調整される JavaScript を使用してカウントダウン タイマーを作成する方法はありますか? (例: 現在時刻から 2012 年の正月までのカウントダウンが 0 になると、3 月の誕生日までのカウントダウンに変わります) (これは、イベントのスケジュールのカウントダウンとして使用できます。スケジュールと、スケジュールの最初の部分までのカウントダウンが終了すると、スケジュールの次の部分へのカウントダウン)

Answer 1

var timeForNextFunction = false;

function firstFunction(){
    //set timeForNextFunction = true when its time for the next function.
};
function nextFunction(){};

var tick = 100; //milliseconds
document.setInterval(function(){
      if (timeForNextFunction)
          nextFunction();
      else
          firstFucntion();
}, tick);

Answer 2

確かに、多くのカウントダウンの中から、jCounterを試して、そのフォールバックを設定して、プラグインの別のインスタンスを別の日付で起動することができます。

これは、jCounter で行う方法です。

$('.counterClass').jCounter({
  date: '31 december 2012 23:59:59', 
  format: 'dd:hh:mm:ss', // display days, hours, minutes and seconds, you can choose here what to display
  fallback: function() { $('.counterClass').jCounter({ // fallback for the next countdown
    date: '31 march 2013 00:00:00', 
    format: 'dd:hh:mm:ss', // format
    fallback : function() { alert("Happy Birthday!") } // second fallback
  }); }
});

jCounter はサーバー側のタイムゾーンに依存していることに注意してください。デフォルトは 'Europe/London' です。(他の設定の中で) タイムゾーン: 'Europe/Oslo' などを追加することで変更できます。

Answer 3

の配列を持つことができますDate。次に例を示します。

function newDate(seconds){
    var d=new Date();
    d.setTime(new Date().getTime()+1000*seconds);
    return d;
}
var events=[newDate(10),newDate(40)];

その後

var currentEvent=0,
    cntdwn=document.getElementById('seconds');
    refreshEvent();
var timer=setInterval(display,1000);

function display(){
    var seconds=Math.ceil((events[currentEvent].getTime()-new Date().getTime())/1000);
    if(seconds>=0){
        cntdwn.innerHTML=seconds;
    }else{
        if(currentEvent<events.length-1){
            currentEvent++;
            refreshEvent();
        }else{
            clearTimeout(timer);
            // Finished
        }
    }
}
function refreshEvent(){
    document.getElementById('currentDate').innerHTML=events[currentEvent];
}

こちらをご覧ください：http://jsfiddle.net/epUG4/