按照于网上的一部分案例，终于自己实现了利用Datepicker单选年份或月份。
需要进入的css与js分别为：
1、jquery-ui.css
2、bootstrap-datetimepicker.min.css
3、jquery-1.11.3.min.js
4、jquery-ui.js
5、bootstrap-datetimepicker.min.js
6、bootstrap-datetimepicker.zh-CN.js
一、实现年份的单选
样例：
代码如下：
1 <html lang="en">
2 <head>
3 <meta charset="utf-8">
4 <meta name="viewport" content="width=device-width, initial-scale=1">
5 <title>jQuery UI Datepicker - Default functionality</title>
6 <link rel="stylesheet" href="jquery-ui.css">
7 <link rel="stylesheet" href="bootstrap-datetimepicker.min.css">
8 <!--调用JS，这里是url-->
9 <script src="jquery-1.11.3.min.js"></script>
10 <script src="jquery-ui.js"></script>
11 <script src="bootstrap-datetimepicker.min.js"></script>
12 <script src="bootstrap-datetimepicker.zh-CN.js"></script>
13 <style>
14 .ui-datepicker-calendar {
15 display: none;
16 }
17 .ui-datepicker-month {
18 display: none;
19 }
20 </style>
21 <!--写函数-->
22 <script>
23 $( function() {
24 $("#datepicker").datepicker({
25 changeYear: true,
26 showButtonPanel: true,
27 dateFormat: 'yy',
28 onClose: function(dateText, inst) {
29 var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
30 $(this).datepicker('setDate', new Date(year, 1, 1));
31 }
32 });
33 })
34 </script>
35 </head>
36 <body>
37
38 <!--调用id，id是唯一标识-->
39 <p>Year: <input type="text" id="datepicker"></p>
40 </body>
41 </html>
二、实现月份的单选
样例：
代码如下：
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>jQuery UI Datepicker - Default functionality</title>
<link rel="stylesheet" href="jquery-ui.css">
<link rel="stylesheet" href="bootstrap-datetimepicker.min.css">
<!--调用JS，这里是url-->
<script src="jquery-1.11.3.min.js"></script>
<script src="jquery-ui.js"></script>
<script src="bootstrap-datetimepicker.min.js"></script>
<script src="bootstrap-datetimepicker.zh-CN.js"></script>
<style>
.ui-datepicker-calendar {
display: none;
}
.ui-datepicker-year {
display: none;
}
</style>
<!--写函数-->
<script>
$( function() {
$("#datepicker").datepicker({
changeMonth: true,
showButtonPanel: true,
dateFormat: 'mm',
onClose: function(dateText, inst) {
var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
console.log("month="+ month);
$("#datepicker").val(parseInt(month) + 1);
}
});
})
</script>
</head>
<body>
<!--调用id，id是唯一标识-->
<p>Month: <input type="text" id="datepicker"></p>
</body>
</html>