bootstrap-datepicker的使用

学习网址：http://www.htmleaf.com/jQuery/Calendar-Date-Time-picker/201706194582.html

bootstrap-datepicker是一款Bootstrap日期选择器插件。该日期选择器插件支持多种语言，可通过配置参数设置日期选择器，日期范围选择器等，功能非常强大

下载引用文件的地址：
https://github.com/eternicode/bootstrap-datepicker

引用方法：

<link rel="stylesheet" href="bootstrap.min.css">
<link rel="stylesheet" href="bootstrap-datepicker3.css">
<script src="jquery.min.js"></script>
<script src="bootstrap.min.js"></script>
<script src="bootstrap-datepicker.js"></script>  

如果需要使用i18n文件，还需要引入相应的js文件，例如简体中文需要引入bootstrap-datepicker.zh-CN.min.js文件。

<script type="text/javascript" src="dist/locales/bootstrap-datepicker.zh-CN.min.js"></script>   

这里要注意bootstrap-datepicker.zh-CN.js需要放在locales目录下。 例如:<script src="/assets/js/date-time/locales/bootstrap-datepicker.zh-CN.js"></script>

HTML结构：

<input data-provide="datepicker">

初始化插件

在页面DOM元素加载完毕之后，可以通过datepicker()方法来初始化bootstrap-datepicker日期选择器插件。

$('.datepicker').datepicker({
                language: 'zh-CN',
                autoclose: true,
                todayHighlight: true,
                format: 'yyyy/mm/dd',
});