日期时间


可以使用div、span或input等其他元素来承载日期组件
如果你想用框架内置的表单验证插件在表单中对其进行验证。则必须使用input元素来承载,并且将初始化日期设置为空(缺省date属性)
建议使用input元素来承载,因为div文本清空时,可能会造成抖动效果

在表单中,样式会被改变,具体查看表单介绍

单选日期
代码
<!--不一定是input,可以使用div或span等其他元素-->
<input type="text" id="date1" class="date" style="width: 140px;" value="" readonly/>

<script>
	javaex.date({
		id : "date1",		// 承载日期组件的id
		monthNum : 1,		// 1代表选择单日日期
		date : "2018-01-01",	// 选择的日期
		// 重新选择日期之后返回一个时间对象
		callback : function(rtn) {
			alert(rtn.date);
		}
	});
</script>
参数说明(使用属性默认值时,可以缺省该属性)
序号 属性名 默认值 说明
1 id 承载日期组件的id
2 monthNum 1 选择单日日期还是范围日期。1代表选择单日日期;2代表选择范围日期
3 date 选择的日期
4 alignment left 日期选择框的对齐方式。left代表左对齐;right代表右对齐
5 minTime 最小可选时间,格式2018-08-15,亦可简写为today
6 maxTime 最大可选时间,格式2018-08-15,亦可简写为today
7 callback 重新选择日期之后返回一个时间对象。按照示例上的写

范围日期
代码
<!--不一定是input,可以使用div或span等其他元素-->
<input type="text" id="date2" class="date" style="width: 220px;" value="" readonly/>

<script>
	javaex.date({
		id : "date2",		// 承载日期组件的id
		monthNum : 2,		// 2代表选择范围日期
		startDate : "2017-08-01",	// 开始日期
		endDate : "2017-08-20",		// 结束日期
		// 重新选择日期之后返回一个时间对象
		callback : function(rtn) {
			alert(rtn.startDate + " - " + rtn.endDate);
		}
	});
</script>
参数说明(使用属性默认值时,可以缺省该属性)
序号 属性名 默认值 说明
1 id 承载日期组件的id
2 monthNum 1 选择单日日期还是范围日期。1代表选择单日日期;2代表选择范围日期
3 startDate 开始日期
4 endDate 结束日期
5 splitLine - 两个日期之间的连接符
6 alignment left 日期选择框的对齐方式。left代表左对齐;right代表右对齐
7 minTime 最小可选时间,格式2018-08-15,亦可简写为today
8 maxTime 最大可选时间,格式2018-08-15,亦可简写为today
9 callback 重新选择日期之后返回一个时间对象。按照示例上的写

单选日期带时分秒
代码
<input type="text" id="date3" class="date" style="width: 200px;" value="" readonly/>

<script>
	javaex.date({
		id : "date3",	// 承载日期组件的id
		type : "yyyy-MM-dd HH:mm:ss",	// 控件类型
		date : "2018-04-15 01:01:01",	// 选择的日期
		// 重新选择日期之后返回一个时间对象
		callback : function(rtn) {
			alert(rtn.date);
		}
	});
</script>
参数说明(使用属性默认值时,可以缺省该属性)
序号 属性名 默认值 说明
1 id 承载日期组件的id
2 monthNum 1 选择单日日期还是范围日期。1代表选择单日日期;2代表选择范围日期。这里必须是1
3 type 控件类型:yyyy-MM-dd 或 yyyy-MM-dd HH:mm:ss
4 date 选择的日期,带上时分秒。如不带,则默认为00:00:00
5 alignment left 日期选择框的对齐方式。left代表左对齐;right代表右对齐
6 minTime 最小可选时间,格式2018-08-15,亦可简写为today
7 maxTime 最大可选时间,格式2018-08-15,亦可简写为today
8 callback 重新选择日期之后返回一个时间对象。按照示例上的写

仅仅是时分秒的时间选择器
代码
<input type="text" id="time" class="time" style="width:100px;" value="" readonly/>

<script>
	javaex.time({
		id : "time",		// 承载时间组件的id
		time : "11:08:00",
		// 重新选择日期之后返回一个时间对象
		callback : function(rtn) {
			alert(rtn.time);
		}
	});
</script>
参数说明(使用属性默认值时,可以缺省该属性)
序号 属性名 默认值 说明
1 id 承载时间组件的id
2 time 格式为xx:xx:xx,不填则为空
3 callback 重新选择时间之后返回一个时间对象。按照示例上的写