BootStrap -- datetimepiker控件的使用

原创于 2019-05-01 00:05:06 发布 · 235 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#Bootstrap

BootStrap 专栏收录该内容

1 篇文章

订阅专栏

博客介绍了Bootstrap中datetimepiker控件的使用，包含引入相关bootstrap文件，给出了对应的JS代码和HTML代码，并展示了运行结果。

BootStrap – datetimepiker控件的使用

引入的bootstrap文件

<link
 href="${pageContext.request.contextPath}/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css"
 rel="stylesheet" />
 
<script src="${pageContext.request.contextPath}/bootstrap-datetimepicker/js/bootstrap-	   datetimepicker.min.js">
 </script>

JS代码

$(function () {
   $("#datetimepicker").datetimepicker(
   {        
    autoclose:true,//设置是否选择完后自动关闭
    minView: "month", //选择日期后，不会再跳转去选择时分秒 
       language:  'zh-CN',//选择语言
       format: 'yyyy-mm-dd',//输出格式
   }
  );  
 });

HTML代码

<span class="input-group-addon" id="basic-addon1">生日</span>
<div class='input-group date' id='datetimepicker'>
	<input type='text' class="form-control" /> 
        <span class="input-group-addon"> 
        	<span class="glyphicon glyphicon-calendar"></span> 
        </span>
</div>