html让时间只展示年月日_如何在HTML日期输入标签中设置日期格式？

.dateField {

width: 150px;

height: 32px;

border: none;

position: absolute;

top: 32px;

left: 32px;

opacity: 0.5;

font-size: 12px;

font-weight: 300;

font-family: Arial;

opacity: 0;

}

.fakeDateField {

width: 100px; /* less, so we don't intercept click on browser chrome for date picker. could also change this at runtime */

height: 32px; /* same as above */

border: none;

position: absolute; /* position overtop the date field */

top: 32px;

left: 32px;

display: visible;

font-size: 12px; /* same as above */

font-weight: 300; /* same as above */

font-family: Arial; /* same as above */

line-height: 32px; /* for vertical centering */

}

(initial value)

var dateField = document.getElementById("dateField");

var fakeDateField = document.getElementById("fakeDateField");

fakeDateField.addEventListener("click", function() {

document.getElementById("dateField").focus();

}, false);

dateField.addEventListener("focus", function() {

fakeDateField.style.opacity = 0;

dateField.style.opacity = 1;

});

dateField.addEventListener("blur", function() {

fakeDateField.style.opacity = 1;

dateField.style.opacity = 0;

});

dateField.addEventListener("change", function() {

// this method could be replaced by momentJS stuff

if (dateField.value.length < 1) {

return;

}

var date = new Date(dateField.value);

var day = date.getUTCDate();

var month = date.getUTCMonth() + 1; //zero-based month values

fakeDateField.innerHTML = (month < 10 ? "0" : "") + month + "/" + day;

});