flatpickr 是一款功能强大的纯 JS 扁平风格日期时间选择器
插件
。该日期时间选择器支持移动手机，提供多种内置的
主题
效果，并且提供对中文的支持。它的特点还有：
使用 SVG 作为界面的图标
兼容 jQuery
支持对各种日期格式的解析
轻量级，高性能，压缩后的版本仅 6K 大小
对手机原生日期格式的支持
下图说明了使用 jQuery UI、Bootstrap、packadate.js 和 flatpickr 拉齐制作一个日期时间选择器时，所需要的文件尺寸大小：
下图是 flatpickr 日期时间选择器的各种主题效果：
使用方法:
在页面中引入 flatpickr.css 和 flatpickr.js 文件。
-
<link rel="stylesheet" type="text/css" href="/path/to/flatpickr.css">
-
<script src="/path/to/flatpickr.js"></script>
一个最简单的日期时间选择器的 HTML 结构如下：
-
<input id="flatpickr-tryme" placeholder="......">
初始化插件:
有多种方法可以实例化一个日期时间选择器。如下：
-
// 通过class名称，返回一个数组
-
document.getElementsByClassName("myClass").flatpickr({..config});
-
-
// 通过ID
-
document.getElementById("myID").flatpickr();
-
-
// 使用jQuery
-
$(".calendar").flatpickr();
配置参数:
在配置参数中，所有的类型为 string 或 boolean 的参数都可以通过 data-属性在 HTML 标签中进行设置。例如：data-min-date、data-default-date、data-default-date 等。
