通过bootstrap-datetimepicker日历控件简单实现日期选择插入

资源下载：
https://download.csdn.net/download/Your_Lie/13216282.

首先引入css和js文件，顺序不能乱

<!-- Bootstrap CSS -->
<link rel="stylesheet" href="dependencies/bootstrap/css/bootstrap.min.css">
<!-- Bootstrap Js -->
<script src="dependencies/bootstrap/js/bootstrap.min.js"></script>

<!-- 日历控件相关 -->
<link href="dependencies/bootstrap/bootstrap-datetimepicker-master/css/bootstrap-datetimepicker.css" rel="stylesheet">

<script src="dependencies/bootstrap/bootstrap-datetimepicker-master/moment-with-locales.js"></script>

<script src="dependencies/bootstrap/bootstrap-datetimepicker-master/js/bootstrap-datetimepicker.js"></script>

<script src="dependencies/bootstrap/bootstrap-datetimepicker-master/js/locales/bootstrap-datetimepicker.zh-CN.js"></script>

样式代码：

<div class="form-group">
	<div class='input-group date' id='datetimepicker1'>
		<span class="input-group-addon"><i class="fa fa-calendar"></i></span>
		<input class="form-control" type="text" autocomplete="off" value="" id="departureDate" name="date">
	</div>
</div>

JavaScript日历控件配置属性

<script type="text/javascript">
  	//时间日期选择插件
   $("#datetimepicker1").datetimepicker({
   	language: 'zh-CN',     // 语言默认值是'en' ,中文：’zh-CN’
       todayHighlight: true,  //当天日期高亮
       format: 'yyyy-mm-dd',     // 日期格式  'yyyy-mm-dd hh:ii'
       startView: 2,     // 选完时间首先显示的视图 0:从小时视图开始，选分,1:从天视图开始，选小时,2:从月视图开始，选天,3:从年视图开始，选月,4:从十年视图开始，选年
       minView: 1,      //日期时间选择器所能够提供的最精确的时间选择视图,0:从小时视图开始，选分,1:从天视图开始，选小时,2:从月视图开始，选天,3:从年视图开始，选月,4:从十年视图开始，选年
       autoclose: true,  //表示选中日期之后关闭
       todayBtn: true,  //当天时间的按钮，在底部
       minView: "month"
   });
</script>

####最后效果图：