Boostrap-datetimepicker 日期时间选择器————时间制约

Think_Coding

已于 2022-03-15 14:52:36 修改

阅读量1.9k

点赞数 2

文章标签：使用Boostrap-datetimep 设置开始时间不大于结束时间

于 2017-12-01 15:12:48 首次发布

本文链接：https://blog.csdn.net/u010953816/article/details/78686806

版权

本人做项目过程中，使用datetimepicker时间控件时，遇到了一些问题，由于官方文档说的很模糊，网上查了很多终于解决了，分享给大家。

预期效果：出签时间不大于送签时间

JS Code：

<script type="text/javascript">

	var now = new Date();
	$("#sendvisadate").datetimepicker({
		format: 'yyyy-mm-dd',
		language: 'zh-CN',
		endDate: now,//日期小于今天
		autoclose: true,//选中日期后 自动关闭
		pickerPosition:"top-left",//显示位置
		minView: "month"//只显示年月日
	}).on("click",function(){  
	    $("#sendvisadate").datetimepicker("setEndDate",$("#outvisadate").val());  
	}); 
	$("#outvisadate").datetimepicker({
		format: 'yyyy-mm-dd',
		language: 'zh-CN',
		autoclose: true,//选中日期后 自动关闭
		pickerPosition:"top-left",//显示位置
		minView: "month"//只显示年月日
	});
</script>
	$("#sendvisadate").datetimepicker({
		format: 'yyyy-mm-dd',
		language: 'zh-CN',
		endDate: now,//日期小于今天
		autoclose: true,//选中日期后 自动关闭
		pickerPosition:"top-left",//显示位置
		minView: "month"//只显示年月日
	}).on("click",function(){  
	    $("#sendvisadate").datetimepicker("setEndDate",$("#outvisadate").val());  
	}); 
	$("#outvisadate").datetimepicker({
		format: 'yyyy-mm-dd',
		language: 'zh-CN',
		autoclose: true,//选中日期后 自动关闭
		pickerPosition:"top-left",//显示位置
		minView: "month"//只显示年月日
	});
</script>

注：

官方给的changeDate事件不好使，所以选择使用 click 事件。。。