datetimepicker是bootstrap中的一款日期和时间选择器，其使用和配置方法较为简单
2.首先需要引入的js和css文件：

css：




bootstrap.min.css（含有bootstrap 所有css）


bootstrap-datetimepicker.min.css（日期控件所需的样式表）


js：


jquery-1.11.1.min.js（其他版本的jquery也可以）


bootstrap.min.js（含有bootstrap 所有js）


bootstrap-datetimepicker.js（日期控件所需的js）


bootstrap-datetimepicker.zh-CN.js（日期控件中文文件）


说明：引入js时，
jquery-1.11.1.min.js必须在bootstrap.min.js之前。后者依托前者。
3.使用方法

3.1普通日期选择
添加选择器的input输入框
<input id="datetimeStart" value="2016-09-14">
js文件中的配置：
$('#datetimeStart').datetimepicker({
	format: 'yyyy.mm',
//显示格式可为yyyymm/yyyy-mm-dd/yyyy.mm.dd
weekStart: 1,
	//0-周日,6-周六 。默认为0
autoclose: true,
startView: 3,
	//打开时显示的视图。0-'hour' 1-'day' 2-'month' 3-'year' 4-'decade'
minView: 3,
	//最小时间视图。默认0-'hour'
//
maxView: 4, 	//最大时间视图。默认4-'decade'
//
todayBtn:true, 	//true时"今天"按钮仅仅将视图转到当天的日期。如果是'linked'，当天日期将会被选中。
//
todayHighlight:true,	//默认值: false,如果为true, 高亮当前日期。
initialDate: new Date(),	//初始化日期.默认new Date()当前日期
forceParse: false,
	//当输入非格式化日期时，强制格式化。默认true
bootcssVer:3,	//显示向左向右的箭头
language: 'zh-CN' //语言
});
效果如下：
	其他属性可到官网查看
http://www.bootcss.com/p/bootstrap-datetimepicker
3.2两个日期控件。使得开始日期与结束日期之间建立相互约束关系。即开始日期不能大于结束日期，结束日期不能小于开始日期。
html代码：
<input size="16" type="text" id="datetimeStart" readonly class="form_datetime">
--
<input size="16" type="text" id="datetimeEnd" readonly class="form_datetime">

js代码：
<script type="text/javascript">
$("#datetimeStart").datetimepicker({
format: 'yyyy-mm-dd',
minView:'month',
language: 'zh-CN',
autoclose:true,
startDate:new Date()
}).on("click",function(){
$("#datetimeStart").datetimepicker("setEndDate",$("#datetimeEnd").val())
});
$("#datetimeEnd").datetimepicker({
format: 'yyyy-mm-dd',
minView:'month',
language: 'zh-CN',
autoclose:true,
startDate:new Date()
}).on("click",function(){
$("#datetimeEnd").datetimepicker("setStartDate",$("#datetimeStart").val())
});
</script>

效果如下：

参考：http://www.cnblogs.com/gscq073240/articles/6413972.html
4.补充

效果图在官网下载的演示文件中。