bootstrap3 和4 有什么区别_Bootstrap3 datetimepicker控件的使用方法

Bootstrap3 日期+时间选择控件的使用方法，供大家参考，具体内容如下

1.支持日期选择，格式设定

2.支持时间选择

3.支持时间段选择控制

4.支持中文

官网地址：http://eonasdan.github.io/bootstrap-datetimepicker/
git地址：ps://github.com/Eonasdan/bootstrap-datetimepicker">https://github.com/Eonasdan/bootstrap-datetimepicker
moment语言包：https://github.com/moment/moment
datetimepicker使用配置说明：http://eonasdan.github.io/bootstrap-datetimepicker/Options/
moment时间格式化使用说明：http://momentjs.com/docs/

使用方法，引用的文件：

<scriptsrc="../Js/jquery-1.11.3.min.js"></script> <scriptsrc="../Js/bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>   <scriptsrc="../Js/bootstrap-datetimepicker/js/moment-with-locales.min.js"></script> <scriptsrc="../Js/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js"></script>

实例1，简单配置：

选择日期： 选择日期+时间： $(function() {
$("#datetimepicker1").datetimepicker({ format:"YYYY-MM-DD", locale: moment.locale("zh-cn") }); $("#datetimepicker2").datetimepicker({ format:"YYYY-MM-DD hh:mm", locale: moment.locale("zh-cn") }); });

实例2，选择时间段：

选择开始时间： 选择结束时间： $(function() { varpicker1 = $("#datetimepicker1").datetimepicker({ format:"YYYY-MM-DD", locale: moment.locale("zh-cn"), //minDate: "2016-7-1" }); varpicker2 = $("#datetimepicker2").datetimepicker({ format:"YYYY-MM-DD", locale: moment.locale("zh-cn") }); //动态设置最小值 picker1.on("dp.change",function(e) { picker2.data("DateTimePicker").minDate(e.date); }); //动态设置最大值 picker2.on("dp.change",function(e) { picker1.data("DateTimePicker").maxDate(e.date); }); });

bootstrap3 和4 有什么区别_Bootstrap3 datetimepicker控件的使用方法

http://m.bbyears.com/wangyezhizuo/115967.html

推荐访问:bootstrap3下载