bootstrap-datetimepicker时间插件使用

bootstrap(可以快速搭建前端页面的css库,但又不单单是一个库,还有许多组件和插件),日期时间选择器是bootstrap日期和时间表单组件。

使用bootstrap-datetimepicker时间插件css需要引入:

.../css/bootstrap/bootstrap.min.css
../css/bootstrap/bootstrap-datetimepicker.min.css

js需要引入:

../js/jquery-1.11.1.min.js
.../js/bootstrap/bootstrap.min.js
.../js/bootstrap/bootstrap-datetimepicker.min.js

如果用汉化的时间格式,需要引入:

.../js/locales/bootstrap-datetimepicker.zh-CN.js

页面引用:

插件提供了一个datetimepicker({})方法,相当于JQuery的点击时间;只需在页面添加一个表单的文本输入框


获取该输入框JQuery对象,调用该方法,相当于给输入框绑定了点击时间。

$("input[name='startTime']").datetimepicker({
  minView : "day", //  选择时间时,最小可以选择到那层;默认是‘hour’也可用0表示
  language : 'zh-CN', // 语言
  autoclose : true, //  true:选择时间后窗口自动关闭
  format : 'yyyy-mm-dd hh:00:00', // 文本框时间格式,设置为0,最后时间格式为2017-03-23 17:00:00
  todayBtn : true, // 如果此值为true 或 "linked",则在日期时间选择器组件的底部显示一个 "Today" 按钮用以选择当前日期。
  startDate : new Date() ,  // 窗口可选时间从今天开始
      endDate : new Date()   // 窗口最大时间直至今天
})

一般几个属性就够用了。更多属性,请转datetimepicker官方帮助文档

** 今天遇到个问题:**
在火狐中弹出层