需求:
如下图1的日期选择框,点第一个输入框,会弹出日期选项(选择到具体的时间点后,如图2,会自动关闭,),需要把选择的日期分别填到3个框中(yyyy-MM-dd、hh、mm)
解决:
点第一个输入框,会弹出日期选项,日期框的js代码如下
$('.form_datetime').datetimepicker({
format: 'yyyy-mm-dd',//显示格式
initialDate: new Date(),//初始化当前日期
autoclose: true,//选中自动关闭
todayBtn: true,//显示今日按钮
language:'zh-CN'//汉化日历
});
且加入onChange事件到第一个框中,如下:
function setDateHourMinute() {
// 获取到日期选择器的选择后的日期(精确到分钟),然后格式化该Date日期类型
var time = $(".form_datetime").datetimepicker("getDate").format("yyyy-MM-dd hh:mm");
// 日期
$("#date").val(overtimeStart.substring(11, 13));
// 小时
$("#hour").val(overtimeStart.substring(14, 16));
// 分钟
$("minute").val(overtimeStart.substring(11, 13));
}
而js中日期的format方法需要自己去写:
//js格式化日期输出
Date.prototype.format = function(fmt) {
var o = {
"M+" : this.getMonth()+1, //月份
"d+" : this.getDate(), //日
"h+" : this.getHours(), //小时
"m+" : this.getMinutes(), //分
"s+" : this.getSeconds(), //秒
"q+" : Math.floor((this.getMonth()+3)/3), //季度
"S" : this.getMilliseconds() //毫秒
};
if (/(y+)/.test(fmt)) {
fmt=fmt.replace(RegExp.$1, (this.getFullYear()+"").substr(4 - RegExp.$1.length));
}
for(var k in o) {
if(new RegExp("("+ k +")").test(fmt)){
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length==1) ? (o[k]) : (("00"+ o[k]).substr((""+ o[k]).length)));
}
}
return fmt;
}
备注:
id命名中有符号的(例如:“list[index].startTime”)的元素,不能直接通过$("#idName")获取,获取方式如下
$('[id="list[0].startTime"]')