<script type="text/javascript" src="./js/jquery-1.9.1.min.js"></script> <link type="text/css" rel="stylesheet" href="./bootstrap/css/bootstrap.min.css"> <script type="text/javascript" src="./bootstrap/js/bootstrap.min.js"></script> <link type="text/css" rel="stylesheet" href="./bootstrap-datetimepicker-master/css/bootstrap-datetimepicker.min.css"> <script type="text/javascript" src="./bootstrap-datetimepicker-master/js/bootstrap-datetimepicker.min.js"></script> <script type="text/javascript" src="./bootstrap-datetimepicker-master/js/bootstrap-datetimepicker.zh-CN.js"></script>
首先要引入插件库
2.html部分
<div class="form-group"> <label >查询时间</label> <input type="text" class="form-control form-filter yearpicker" readonly name="year" id="search_year" /> <label >年</label> </div>
3.js部分
<script type="text/javascript"> $("#search_year").datetimepicker({ format: 'yyyy', startView : "decade", minView: 'decade', language : 'zh-CN', autoclose: true }).on('changeDate',function(ev){ var search_year=$("#search_year").val(); $("#search_year").datetimepicker('hide'); }); </script>