HTML5 datepicker会阻止过去的日期 [英] HTML5 datepicker prevent past dates
本文介绍了HTML5 datepicker会阻止过去的日期的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我正在预订电影票的网站上工作。我应该如何设置 min 属性，以防止HTML5日期选择器中的过去日期？ （我不想使用这里提到的PHP解决方案。）
I am working on a website for booking movie tickets. What should I set the min attribute to, to prevent past dates in the HTML5 datepicker? (I do not want to use PHP solution mentioned here.)
是否有纯HTML5 / Javascript解决方案？
Is there a pure HTML5/Javascript solution for this?
推荐答案
当文档加载禁用日期输入。运行 onload 函数，将当前日期以所需格式插入到min字段中。
When the document loads have the date input disabled. Run an onload function that inserts today's date into the min field in the required format.
function onLoad() {
var input = document.getElementById("dateField");
var today = new Date();
// Set month and day to string to add leading 0
var day = new String(today.getDate());
var mon = new String(today.getMonth()+1); //January is 0!
var yr = today.getFullYear();
if(day.length < 2) { day = "0" + day; }
if(mon.length < 2) { mon = "0" + mon; }
var date = new String( yr + '-' + mon + '-' + day );
input.disabled = false;
input.setAttribute('min', date);
}
document.addEventListener('load', onLoad, false);
<body>
<input id="dateField" type="date" disabled />
</body>
这里有一个小提琴： http://jsfiddle.net/tj9Xh/2/
这篇关于HTML5 datepicker会阻止过去的日期的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
