利用Bootstrap-datepicker插件选择日期

最新推荐文章于 2024-08-09 21:30:00 发布

badielu2864

最新推荐文章于 2024-08-09 21:30:00 发布

阅读量93

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/YanCJ/p/7392735.html

版权

Bootstrap-datepicker也是一款非常好用的选择日期插件，Github上的star已有9994个star，作者还针对不同的语言封装了日期语言包，非常方便使用，传送门：uxsolutions/bootstrap-datepicker。
使用说明，看官方文档，需要使用css预处理语言less将build/build_standalone.less编译为datepicker.css，然后再页面引入jquery.js、bootstrap-datepicker.js、因为我们一般使用简体中文，所以还需要引入bootstrap-datepicker.zh-CN.js（该文件位于 js/locales 下）

<!DOCTYPE html>
<html lang="en">
<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" id="datepicker" 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>

转载于:https://www.cnblogs.com/YanCJ/p/7392735.html

badielu2864

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
利用Bootstrap-datepicker插件选择日期

Bootstrap-datepicker也是一款非常好用的选择日期插件，Github上的star已有9994个star，作者还针对不同的语言封装了日期语言包，非常方便使用，传送门：uxsolutions/bootstrap-datepicker。使用说明，看官方文档，需要使用css预处理语言less将build/build_standalone.less编译为datepicker.cs...
复制链接

扫一扫