bootstrap datetimepicker日期插件使用方法

1,253 阅读1分钟

                                                    bootstrap datetimepicker日期插件使用方法

1、引入必要的文件
<!-- bootstrap的所有组件都是依赖jquery,所以必须先加载jquery -->
<script type="text/javascript" src=".../lib/jquery/jquery.min.js"></script>

<!-- 加载bootstrap -->
<link rel="stylesheet" type="text/css" href=".../lib/bootstrap/bootstrap.min.css" />
<script type="text/javascript" src=".../lib/bootstrap/bootstrap.min.js"></script>

<!-- 引入日期插件 -->
<link rel="stylesheet" type="text/css" href=".../lib/bootstrap/bootstrap-datetimepicker.min.css">
<script src=".../lib/bootstrap/bootstrap-datetimepicker.js"></script>

<!-- 想要中文显示,引入 zh_CN.js -->
<script src=".../lib/bootstrap/bootstrap-datetimepicker.zh_CN.js"></script>

2、输入框日期选择
<input class="form-control" id="choose_time" style="width:200px" type="text"  placeholder="请选择日期">

3、调用初始化日期插件方法
<script>
$('.choose_time').datetimepicker({
language: 'zh-CN',            //显示中文
format: 'yyyy-mm-dd',        //显示格式
minView: "month",            //设置只显示到月份
initialDate: new Date(),    //初始化当前日期
autoclose: true,            //选中自动关闭
todayBtn: true                //显示今日按钮
})
</sript>

4、日期时间选择器官网 http://www.bootcss.com/p/bootstrap-datetimepicker/index.htm