bootstrap-4的datetimepicker实现多选日期且过期的日期不可选择

     在实现之前,找了很多教程发现并不适用,结果参看了官网的实例,其实也就是几行代码解决的事情,贴出来希望能让和我一样迷惑的小伙伴能尽快解决自己的问题~

本文目录:

1.先看一下官网给的多选日历控件的实现代码

2.实现设置过期日期不可选择


1.先看一下官网给的多选日历控件的实现代码

     点这里进官网看实例     

bootstrap-4的datetimepicker实现多选日期且过期的日期不可选择_第1张图片

实现效果:

bootstrap-4的datetimepicker实现多选日期且过期的日期不可选择_第2张图片

 


可以发现,官网给的代码只能实现日期多选,并不能实现将过期的日期设置为不可选择

因此动手来改吧~~见小标题2

 

2.实现设置过期日期不可选择

对1.中官网给出的实例进行修改:

在设置里面加上一行代码minDate:new Date(),//过期时间不可选择

 

具体代码如下:

 

实现效果:可以看到,今日11号之前的日期变成了灰色,用户不可选择

bootstrap-4的datetimepicker实现多选日期且过期的日期不可选择_第3张图片

你可能感兴趣的:(前端开发)