如何在Datepicker中更改顯示的日期格式？

我使用JQuery UI輸入日期並使用DatePicker。如何在Datepicker中更改顯示的日期格式？

enter image description here

我需要有日期顯示的一樣yyyy-mm-dd。

我試過這個解決方案在這個答案在控制檯提示：how to change dateformat of jquery Datepicker

$(".date-input").datepicker({ dateFormat: 'yy-dd-mm' });

在控制檯返回

：

[<input class="date-input hasDatepicker" name="TRAVELDAY_TO" title="Enter date you plan to go to your destination" placeholder="Go to date" type="date" value="2014-05-08 00:00:00" id="dp1399632827005">, 
<input class="date-input hasDatepicker" name="TRAVELDAY_FROM" title="Enter the date when you plan to come back" placeholder="Come back date" type="date" value="2014-05-13 00:00:00" id="dp1399632827006">]

但沒有改變生效。

那麼，如何更改Datepicker中顯示的日期格式？

後來編輯：

如果我改變type="date"爲type="text"（參見：http://jsfiddle.net/Zksv5/）的代碼工作，但我想使它成爲類型的日期格式工作。

那麼，當輸入有type="date"屬性時，如何在Datepicker中更改顯示的日期格式？

來源

2014-05-09 Eduard Florinescu

必須在控制檯中出錯，是嗎？ – Rorschach

@Rorschach返回上面提到的問題中的兩條線 –

這是實現它的方法。它工作得很好。看到這裏：http://jsfiddle.net/abhitalks/w5YQk/。當然，你的代碼中還有其他問題。 – Abhitalks

你在做什麼是格式化的jQuery用戶界面的datepicker的正確途徑。

在這裏看到：http://jsfiddle.net/abhitalks/w5YQk/

HTML：

<input id="dated" />

jQuery代碼：

$("#dated").datepicker({ dateFormat: 'yy-dd-mm' });

更新（根據您的評論HTML5 date型）：

沒有重複那些已經在這裏描述： Is there any way to change input type="date" format?：簡短的回答是，在規範的傳輸格式是「YYYY-MM -dd「，但瀏覽器可以自由決定演示文稿的。某些瀏覽器（如Chrome）會在客戶端機器的區域設置中顯示日期，而其他瀏覽器（如Opera）則顯示連線格式。所以，你在這裏做不了多少。
當輸入是HTML5 date 類型時，jQuery UI datepicker將失敗。實際上，只有在設置了格式後，它纔會起作用，並且將自己轉換爲date類型輸入的有線格式！所以，再次你不能在這裏做很多。
理想情況下，你應該提出一個jQuery（或任何其他）datepicker 只有如果沒有對HTML5 date型瀏覽器的支持。如果支持，則應首選默認瀏覽器實現。

所以，你這裏有兩種選擇：（一）使用正text類型和連接datepicker提供共同的外觀和感覺。 （b）僅當瀏覽器不支持HTML5 date類型時，依賴於date類型並回退到datepicker。

您可以使用您選擇的任何圖書館根據瀏覽器功能檢測進行決策。（如Modernizr的等）

如果你想自己做，那麼這個例子可以幫助你（解釋作爲嵌入代碼註釋）：

演示：http://jsfiddle.net/abhitalks/w5YQk/3/

HTML ：

<input id="dated" type="text" /> <!-- Regular "text" type input --> 
<input id="dated2" type="date" /> <!-- HTML5 "date" type input -->

jQuery代碼 ：

var dtType; 

// We know this is text type so attaching datepicker 
$("#dated").datepicker({ dateFormat: 'yy-dd-mm' }); 

// We check the type of the second element 
dtType = document.getElementById("dated2").type; 

/* 
If the browser supports html5 date type, then it will return "date". 
If browser doesn't support, it will default to "text" type. 
*/ 

if (dtType == "text") { 
    // Attach datepicker only if type is "text" 
    $("#dated2").datepicker(); 
}

這需要的事實，即它不支持HTML5 date類型將默認爲text等元素將在DOM text類型的瀏覽器。

希望有所幫助。

來源

2014-05-10 13:19:54 Abhitalks

指該工作jsfiddle

<input type="text" value="" class="date-input" id="TxtStrtDate" > 

$(".date-input").datepicker({ 
    dateFormat: 'yy-dd-mm' 
});

來源

2014-05-09 11:39:14 Dave

我改變了你鏈接的jsfiddle中的type =「date」，它不再有效。 –

如何在Datepicker中更改顯示的日期格式？

回答

相關問題