1、下载及初始化
https://github.com/uxsolutions/bootstrap-datepicker
下载完成后解压,把dist文件夹中的所有文件放到项目中任意位置,引入下图所示的文件即可。
然后在页面body元素中创建一个容器,如下所示。
末了在id为sandbox-container的div元素中创建input元素,并运行以下代码脚本,一个日期选择器就创建好了。
2、特色展示
⑴组件选择
⑵内联选择
⑶范围选择
⑷格式化日期
⑸最大最小日期
⑹选择器开始界面
0:天(默认)
1:月
2:年
3:十年
4:世纪
⑺最大最小选择精度
minViewMode最小、maxViewMode最大
0:天(最小默认)
1:月
2:年
3:十年
4:世纪(最大默认)
⑻今日、打消按钮
⑼选择器方向
auto:自动(默认)
top auto:向上自动
bottom auto:向下自动
auto left:自动向左
top left:左上
bottom left:左下
auto right:自动向右
top right:右上
bottom right:右下
⑽星期禁用、高亮
⑾多选、分隔符
⑿显示第几周
⒀选择后自动关闭
⒁今日高亮
⒂选择器界面显示之前的回调函数
有世纪、十年、年、月、日五种类型,如下所示是(日的例子)
⒃禁用日期
⒄选中取消
⒅默认初始化视图
⒆键盘操作
⒇星期几作为一周的开始
在线演示网站:
https://uxsolutions.github.io/bootstrap-datepicker/
API文档:
https://bootstrap-datepicker.readthedocs.io/en/latest/index.html
bootstrap datepicker内置8个事宜(显示、隐蔽选择器事宜、打消日期选中事宜和世纪、十年、年、月、日改变事宜),内置20个方法(如销毁、显示、隐蔽、更新选择器方法等),支持键盘操作选择日期,支持日期校验等,功能丰富,希望往后能够加入韶光选择。
有哪里写得不好的地方请大家提出来,请轻喷,感激。 同时有什么与编程干系的好东西可以保举给我,再次感谢!