html input日期值,input标签设置时间值

研究了两天javascript日期相关的内容，一句话总结：“浏览器可以用上十万年，因为javascript支持的时间范围就是这么长”。

通过实验来看，比较好用的是type="date",及type="datetime-local"

关于设置值的结论：

(1)2020-03-26格式可用于date、datetime

(2)2020-03-26 22:32:07格式仅可以用于datetime

(3)2020-03-26T22:33:03格式可以用于datetime、datetime-local

关于输入及校验日期的正确性：能输入不代表就能正确转换成日期

代码：没写过WEB程序，算是个练习，将就着看吧。

table.gridtable {

font-family: verdana,arial,sans-serif;

font-size: 11px;

color: #333333;

border-width: 1px;

border-color: #666666;

border-collapse: collapse;

}

table.gridtable th {

border-width: 1px;

padding: 8px;

border-style: solid;

border-color: #666666;

background-color: #dedede;

text-align: center;

}

table.gridtable td {

border-width: 1px;

padding: 8px;

border-style: solid;

border-color: #666666;

background-color: #ffffff;

}

function FormatDate() {

//var current = new Date();

var now = new Date();

var year = now.getFullYear();

//month返回数组(0-11)

var month = ("0" + (now.getMonth() + 1)).slice(-2);

//getDate返回日期(1-31)

var day = ("0" + now.getDate()).slice(-2);

var formatedDate = year + "-" + month + "-" + day;

//alert("系统时间:" + now + "\n格式化时间：" + formatedDate);

return formatedDate;

}

function FormatDate1() {

//var current = new Date();

var now = new Date();

var year = now.getFullYear();

//month返回数组(0-11)

var month = ("0" + (now.getMonth() + 1)).slice(-2);

//getDate返回日期(1-31)

var day = ("0" + now.getDate()).slice(-2);

var formatedDate = year + "/" + month + "/" + day;

//alert("系统时间:" + now + "\n格式化时间：" + formatedDate);

return formatedDate;

}

function FormatDateTime() {

//var current = new Date();

var now = new Date();

var year = now.getFullYear();

//month返回数组(0-11)

var month = ("0" + (now.getMonth() + 1)).slice(-2);

//getDate返回日期(1-31)

var day = ("0" + now.getDate()).slice(-2);

//

var hour = ("0" + now.getHours()).slice(-2);

var minute = ":" + ("0" + now.getMinutes()).slice(-2);

var second = ":" + ("0" + now.getSeconds()).slice(-2);

var formatedDate = year + "-" + month + "-" + day + " " + hour + minute + second;

//alert("系统时间:" + now + "\n格式化时间：" + formatedDate);

return formatedDate;

}

function FormatDateTimeLocal() {

//var current = new Date();

var now = new Date();

var year = now.getFullYear();

//month返回数组(0-11)

var month = ("0" + (now.getMonth() + 1)).slice(-2);

//getDate返回日期(1-31)

var day = ("0" + now.getDate()).slice(-2);

//

var hour = ("0" + now.getHours()).slice(-2);

var minute = ":" + ("0" + now.getMinutes()).slice(-2);

var second = ":" + ("0" + now.getSeconds()).slice(-2);

var formatedDate = year + "-" + month + "-" + day + "T" + hour + minute + second;

return formatedDate;

}

input标签typeinput标签输入格式测试

input type="date"

input type="datetime"

input type="datetime-local"

function setDate1() {

var str = FormatDate();

$("#lb00001").prop("innerHTML", str);

$('#mydate00001').prop('value',str );

$('#mydate00002').prop('value', str);

$('#mydate00003').prop('value', str)

}

function setDate2() {

var str = FormatDateTime();

$("#lb00002").prop("innerHTML", str);

$('#mydate00001').prop('value', str);

$('#mydate00002').prop('value', str);

$('#mydate00003').prop('value', str);

}

function setDate3() {

var str = FormatDateTimeLocal();

$("#lb00003").prop("innerHTML", str);

$('#mydate00001').prop('value',str);

$('#mydate00002').prop('value', str);

$('#mydate00003').prop('value', str);

}

---

function dateTest() {

var result="";

$("input[type='date']")

.each(function () {

var v = new Date($(this).val());

result += "\ndate取值:" + $(this).val() + "\n日期时间转换后的值:" + v

}

);

$("input[type='datetime']")

.each(function () {

var v = new Date($(this).val());

result += "\ndatetime取值:" + $(this).val() + "\n日期时间转换后的值:" + v

}

);

$("input[type='datetime-local']")

.each(function () {

var v = new Date($(this).val());

result += "\ndatetime-local取值:" + $(this).val() + "\n日期时间转换后的值:" + v

}

);

alert(result);

};

标签：slice,设置,month,标签,prop,str,var,input,now

来源： https://www.cnblogs.com/lnwuyaowei/p/12578090.html