利用Bootstrap-datepicker插件选择日期

Bootstrap-datepicker也是一款非常好用的选择日期插件,Github上的star已有9994个star,作者还针对不同的语言封装了日期语言包,非常方便使用,传送门:uxsolutions/bootstrap-datepicker

使用说明,看官方文档,需要使用css预处理语言less将build/build_standalone.less编译为datepicker.css,然后再页面引入jquery.jsbootstrap-datepicker.js、因为我们一般使用简体中文,所以还需要引入bootstrap-datepicker.zh-CN.js(该文件位于 js/locales 下)

<!DOCTYPE html>
<html >
<head>
        <meta charset="UTF-8">
        <title>Document</title>
        <link rel="stylesheet" href="./datepicker.css">
        <script src="./js/jquery-3.2.1.js"></script>
        <script src="./js/bootstrap-datepicker.js"></script>
        <script src="./js/locales/bootstrap-datepicker.zh-CN.js"></script>
</head>
<body>
        <div class="input-group date" data-provide="datepicker">
            选择日期:<input type="text"  class="form-control">
            <div class="input-group-addon">
                <span class="glyphicon glyphicon-th"></span>
            </div>
        </div>
        <script>
                $(\'#datepicker\').parent().datepicker({
                        "autoclose":true,"format":"yyyy-mm-dd","language":"zh-CN"
                });
        </script>
</body>
</html>