是否有可能使HTML datetime-local元素只產生有效日期？

我正在使用HTML datetime-local元素從用戶獲取日期時間。此輸入字段的問題在於，它允許用戶輸入無法轉換爲JavaScript對象的值。一些可能投入太大，比如下面的日期是太大：是否有可能使HTML datetime-local元素只產生有效日期？

invalid date

這是當我使用JavaScript它的價值會發生什麼：

var input = document.getElementById("__Date"); 
var time = input.value; // is "121212-12-12T12:12" right now 
var value = new Date(time); // I get an error here - "Invalid Date"

下面是完整的元素題。我正在使用Google Chrome v37來運行此代碼。

<input type="datetime-local" class="input-block-level EditableAttributeValue" autocomplete="off" autocorrect="off" id="__Date" max="2015-00-00T00:00:00:00">

我需要一種方法，以禁止這些無效輸入，優選不使用任何JavaScript來收聽變化和手工驗證輸入。

來源

2014-08-29 Ivan Chub

沒有JavaScript就無法真正做到。你受到瀏覽器的支配。去一個JavaScript解決方案，有很多日期/時間格式庫，以及大量的日期/時間選擇器。 – mason 2014-08-29 19:13:54

JavaScript代碼與HTML代碼（不同的'id'值）不匹配。馬庫肯定你包括*真實*代碼，再現這個問題。 – 2014-08-29 19:15:31

在HTML中有最大的屬性，爲什麼不解決這個問題？ – 2014-08-29 19:18:57

雖然無法使用Date()對象解析datetime-local的值，但您可以通過input.valueAsNumber屬性獲取有效日期，然後轉換爲日期。這解決了問題並消除了對這種驗證的需求。使用方法如下：

var input = document.getElementById("__Date"); 
var dateNumber = input.valueAsNumber; 
var date = new Date(dateNumber); // this is a valid date now - "Tue Dec 11 121212 16:00:00 GMT-0800 (Pacific Standard Time)"

來源

2014-08-29 19:27:09

當我在Chrome 37（Win 7）中測試時，我得到'null'。 – 2014-08-29 19:48:00

嘗試這個網站：http://javascriptref.com/3ed/ch13/valueasdate.html，輸入任何日期似乎工作。 – 2014-08-29 19:53:39

第二個想法是，它只顯示'date'，這裏我使用'datetime-local'。我修復了我的答案，使它適用於'datetime-local'輸入。 – 2014-08-29 19:57:52

是否有可能使HTML datetime-local元素只產生有效日期？

回答

相關問題