除了引入基本的jquery和bootstrap的js、bootstrap的css外,还须要引入bootstrap-datetimepicker.min.js,还有就是bootstrap-datetimepicker.zh-CN.js,由于要中文化。javascript
List-1 htmlcss
<input type="text" class="form-control datetimepicker" id="startDate" style="display: inline;">
对应的js以下List-2所示html
List-2java
$("#startDate").datetimepicker({ format: 'yyyy-mm-dd',//显示格式 todayHighlight: 1,//今天高亮 minView: "month",//设置只显示到月份 startView: 2, forceParse: 0, language: 'zh-CN', showMeridian: 1, autoclose: 1//选择后自动关闭 }).on('changeDate', function (e) { console.log(e.target.value);//获得的就是选择了的日期 });
List-2中能够设置参数,来控制datetimepicker的显示,具体看官网: http://www.bootcss.com/p/bootstrap-datetimepicker/jquery
图3.1bootstrap