2016-03-19 67 views
4

我用moment.js顯示在用戶的本地時區UTC日期:設置日期()到午夜用戶時區與moment.js

var date = new Date(Date.UTC(2016,03,30,0,0,0)); 
var now = new Date(); 
var diff = (date.getTime()/1000) - (now.getTime()/1000); 

var textnode = document.createTextNode(moment(date).format('dddd, DD.MM.YYYY') + ' a las ' + moment(date).format('HH:mm A')); 
document.getElementsByClassName("date")[0].appendChild(textnode.cloneNode(true)); 

我後來用diff變量顯示一個倒數計時器。

我想顯示一個不同的倒計時計時器給每個人在他們當地的時區。 (在他們的時區使用直到其午夜的差異,而不是UTC)

但是我很努力地讓它工作。而不是使用var date = new Date(Date.UTC(2016,03,30,0,0,0));我可能需要使用一些moment.js的功能,這些功能在用戶時區給我直到午夜。

最好的例子是新年前夕。如果我使用UTC,每個人都會有相同的計數器(還剩9個小時),但在世界的不同地區,這是沒有意義的。對於澳大利亞的人來說,應該還剩2個小時,對於美國的人來說應該是14個小時。

+0

當你建立你的'date'變量,則顯式調用'Date.UTC()'。所有你需要做的是構造一個午夜日期**沒有**使用Date.UTC()'權利? – CodingGorilla

+0

感謝讓我感到愚蠢;)你是對的......你可能想回答這個問題,所以我可以接受它 – Snowball

回答

18

我不確定我完全理解你的問題,但我會給你一些一般建議和提示。

  1. 當使用moment.js時,幾乎不需要使用Date對象。僅用於與期望Date對象的其他API進行交互。

  2. 要獲得UTC了一下,只是用moment.utc(...),通過適當的參數,如moment.utc([2016,3,30])moment.utc('2016-04-30')午夜4月30日UTC。

  3. 如果您想將其轉換回用戶的當地時間,請使用.local()函數。例如,moment.utc('2016-04-30').local()將創建一個具有與所提供的UTC時間相當的本地時間的時刻。

  4. 如果你想在用戶的本地時間了一下,那將是moment(...),如moment([2016,3,30])moment('2016-04-30')午夜4月30日本地時間。

  5. 您可以區別使用diff功能,能給出答案的具體單位,兩個時刻如m1.diff(m2, 'seconds')其中m1m2是瞬間的對象。

  6. 您不需要撥打format兩次。只需用方括號封裝你想要輸出的任何文本。 .format('dddd, DD.MM.YYYY [a las] HH:mm A')

  7. 您可能會看到時刻的語言環境支持。如果我沒有弄錯,「las」表示西班牙語,但它不是總是「a las」,但有時是「a la」,如果小時是1。另外,時刻僅使用其.calendar()函數中的那些單詞,例如當生成諸如"mañana a las 13:17"之類的短語時。西班牙語語言環境中格式爲.format('LLLL')的常規日期類似於:"sábado, 19 de marzo de 2016 13:17"。所以,你可能想要證明「las」正是你想要的每一種情況。

  8. 這個問題的標題是如何設置日期到午夜。爲此,我建議使用時刻的startOf功能。 m.startOf('day')將會在當天開始的時刻給出設置m的時刻,這通常是午夜的。請記住,並非每個地區的每一天都在每個時區的午夜開始。由於像daylight saving time這樣的異常,有些日子可能會在1:00開始。例如,今年出現in Brazil on October 16th。另外,如果您使用UTC模式創建時間,則可能希望先將其轉換回本地模式,然後再將其設置爲一天的開始時間。如果您不想更改原始時刻對象,請務必先將其克隆。

    把所有這些組合起來:

    var m1 = moment.utc([2016,3,30]); 
    var m2 = m1.clone().local().startOf('day'); 
    
    var now = moment(); 
    var diff = m1.diff(now, 'seconds'); 
    
+0

這絕對是令人敬畏的馬特,非常感謝。我沒有意識到所有這些細節,因爲我第一次使用時刻將UTC時間轉換爲用戶當地時間,並將其顯示在櫃檯下方。我會更新我的代碼,謝謝! – Snowball

0

因此,答案是非常簡單的(對不起,不是試圖讓你覺得自己很蠢;))

var date = new Date(Date.UTC(2016,03,30,0,0,0)); 
var localDate = new Date(2016,03,30,0,0); 
var now = new Date(); 
var diff = (localDate.getTime()/1000) - (now.getTime()/1000); 

var textnode = document.createTextNode(moment(date).format('dddd, DD.MM.YYYY') + ' a las ' + moment(date).format('HH:mm A')); 
document.getElementsByClassName("date")[0].appendChild(textnode.cloneNode(true)); 

使用默認的構造函數的Date對象讓你在JavaScript本地日期/時間對象。