datetimepicker日期时间选择器

1. 如何打开清空按钮

定义按钮：clear:"清空"

例：dates['zh-cn'] = {

　　today: "今日",

　　clear:"清空"

}

设置参数：clearBtn:true

例：$(".form-datetime").datetimepicker({

　　clearBtn:true,

　　startView: 4,

　　minView: 4

})

2. 如何使弹窗视图只显示年

修改 startView，minView的属性值（数字），4为只显示年；

3. 方法

remove  -  移除日期时间选择器。同时移除已经绑定的event、内部绑定的对象和html元素

$("#datetimepicker").datetimepicker("remove");

 

show  -  显示日期时间选择器

$("#datetimepicker").datetimepicker("show");

 

hide  -  隐藏日期时间选择器

$("#datetimepicker").datetimepicker("hide");

 

update  -  使用当前输入框中的值更新日期时间选择器

$("#datetimepicker").datetimepicker("update");

 

setStartDate

$("#datetimepicker").datetimepicker("setStartDate", "2012-01-01");

给日期时间选择器设置一个新的最小日期，如果要取消startDate的限制可以如下调用小日期

$("#datetimepicker").datetimepicker("setStartDate");

$("#datetimepicker").datetimepicker("setStartDate", null);

 

setEndDate

$("#datetimepicker").datetimepicker("setEndDate", "2012-01-01");

给日期时间选择器设置一个新的最小日期，如果要取消setEndDate的限制可以如下调用小日期

$("#datetimepicker").datetimepicker("setEndDate");

$("#datetimepicker").datetimepicker("setEndDate", null);

 

setDaysOfWeekDisabled

$("#datetimepicker").datetimepicker("setDaysOfWeekDisabled", [0,6]); 

一周中禁用的天数，例如禁用周末：“0,6”或[0,6]，注意：即使weekStart设置为1，禁用的天数也必须从0开始

设置一周中哪些天数需要被禁用，如果要取消限制，可以如何调用

$("#datetimepicker").datetimepicker("setDaysOfWeekDisabled"); 

$("#datetimepicker").datetimepicker("setDaysOfWeekDisabled"，"null"); 

 4. 事件

show  -  当选择器显示时被触发

hide  -   当选择器隐藏时被触发

changeDate  -  当日期被改变时触发

changeYear  -  当十年视图上的年视图view被改变时触发

changeMonth  -  当年视图上的月视图view被改变时触发

outofRange  -  当用户选择的日期超出startDate 或endDate 时，或者通过setDate 或 setUTCDate方法设置日期超出范围时被触发

 

附上配置参数链接

https://blog.csdn.net/weixin_33957648/article/details/85994442?utm_medium=distribute.pc_relevant_t0.none-task-blog-BlogCommendFromBaidu-1.control&depth_1-utm_source=distribute.pc_relevant_t0.none-task-blog-BlogCommendFromBaidu-1.control

 

官方文档链接  点击

https://www.bootcss.com/p/bootstrap-datetimepicker/