如何使用javascript在mvc中顯示事件計時器

Question

我正在開發約會計劃應用程序，我需要使用完整日曆的每個約會事件的計時器。 我想顯示事件計時器，以便我可以啓用/禁用按計時器的呼叫按鈕。

Plz help？ Thanx提前。

Answer 1

試試這個代碼

設置當前日期

TimeZoneInfo timeZoneInfo = TimeZoneInfo.FindSystemTimeZoneById("Timezonename"); 

var d = new Date('@DateTime.UtcNow.ToTimeZoneTime(timeZoneInfo)'); 

計算剩餘時間

function getTimeRemaining(endtime){ 
     var t = Date.parse(endtime) - Date.parse(d); 
     var seconds = Math.floor((t/1000) % 60); 
     var minutes = Math.floor((t/1000/60) % 60); 
     var hours = Math.floor((t/(1000*60*60)) % 24); 
     var days = Math.floor(t/(1000*60*60*24)); 
     return { 
      'total': t, 
      'days': days, 
      'hours': hours, 
      'minutes': minutes, 
      'seconds': seconds 
     }; 
    } 

    var timeinterval; 

用來初始化時鐘

var timeinterval; 
    function initializeClock(endtime){ 
     var clock = document.getElementById(id); 
     timeinterval = setInterval(function(){ 
      var t = getTimeRemaining(endtime); 
      if(t.total<0) 
      { 
       t.seconds =((-1)*parseInt(t.seconds))-1; 
       t.minutes = ((-1)*parseInt(t.minutes))-1; 
       t.hours = ((-1)*parseInt(t.hours))-1; 
       t.days = ((-1)*parseInt(t.days))-1; 
      } 

      t.days= t.days<=9?'0'+t.days:t.days 
      t.hours= t.hours<=9?'0'+t.hours:t.hours 
      t.minutes= t.minutes<=9?'0'+t.minutes:t.minutes 
      t.seconds= t.seconds<=9?'0'+t.seconds:t.seconds 


      var text=(t.days>0)?t.days + ' d ':''; 

      if(t.total<=0){ 

        text='Started ' 
        text+=(t.days>0)?t.days + ' d ':''; 
        text+=(t.hours>0) || (t.days>0)?t.hours + ' h ':''; 
        text+=(t.minutes>0) || (t.hours>0)?t.minutes + ' m ':''; 
        text+=(t.seconds>0) || (t.minutes>0)?t.seconds + ' s ago ':''; 

      } 
      else{ 

       text+=(t.hours>0) || (t.days>0)?t.hours + ' h ':''; 
       text+=(t.minutes>0) || (t.hours>0)?t.minutes + ' m ':''; 
       text+=(t.seconds>0) || (t.minutes>0)?t.seconds + ' s left ':''; 
      } 
      clock.text(text); 
     },1000); 
    }