[转]简易下拉框式日期选择器(带闰平年判断)

[转]简易下拉框式日期选择器(带闰平年判断)
1. <html>
2. <head>
3. <title>日期选择类下拉框</title>
4. <meta http-equiv="content-type" content="text/html; charset=GBK">
5. <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js" charset="GBK"></script>
6. </head>
7. <body>
8. <form name="form">
9. <input type="text" id="time_show"><br>
10. <select id="time_year" onChange="javascript:YearDay(this.value);"></select>
11. <select id="time_month" onChange="javascript:MonthDay(this.value);"></select>
12. <select id="time_day" onChange="javascript:setTimeShow();"></select>
13. <select id="time_hour" onChange="javascript:setTimeShow();"></select>
14. <select id="time_minute" onChange="javascript:setTimeShow();"></select>
15. <select id="time_second" onChange="javascript:setTimeShow();"></select>
16. </form>
17. <script type="text/javascript">
18. var TimeShow = $("#time_show");
19. var TimeYear = $("#time_year");
20. var TimeMonth = $("#time_month");
21. var TimeDay = $("#time_day");
22. var TimeHour = $("#time_hour");
23. var TimeMinute = $("#time_minute");
24. var TimeSecond = $("#time_second");
26. /*默认值*/
27. var Year = "";
28. var Month = "";
29. var Day = "";
30. var Hour = "";
31. var Minute = "";
32. var Second = "";
34. /*赋值格式*/
35. function setTimeShow(){
36. var time = TimeYear.val()+"-"+TimeMonth.val()+"-"+TimeDay.val()+" "+TimeHour.val()+":"+TimeMinute.val()+":"+TimeSecond.val();
37. TimeShow.attr("value",time);
38. }
40. //以下内容可单独保存调用
41. /***************
42. * @ Name 日期选择类下拉框式
43. * @ Version 1.0
44. * @ Writer JSPGen
45. * @ Time 2008年06月
46. * @ Address www.jspgen.com
47. * @ E-mail:jspgen@163.com QQ 190582560
48. ***************/
49. var NowTime = new Date();
50. if(Year == "") { Year = NowTime.getFullYear(); }
51. if(Month == "") { Month = NowTime.getMonth()+1; }
52. if(Day == "") { Day = NowTime.getDate(); }
53. if(Hour == "") { Hour = NowTime.getHours(); }
54. if(Minute == "") { Minute = NowTime.getMinutes(); }
55. if(Second == "") { Second = NowTime.getSeconds(); }
56. var MonthHead = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
57. var DayMax = MonthHead[Month-1];
59. /*写年*/
60. for (var i=Year; i <(Year+3); i++){
61. if(i == Year){
62. TimeYear.append("<option value=\"" +i+ "\" selected >" +i+ "年</option>");
63. }else{
64. TimeYear.append("<option value=\"" +i+ "\">" +i+ "年</option>");
65. }
66. }
67. /*写月*/
68. for (var i = 1; i < 13; i++) {
69. var m = i>9 ? i : "0"+i;
70. if(m == Month){
71. TimeMonth.append("<option value=\"" +m+ "\" selected >" +m+ "月</option>");
72. }else{
73. TimeMonth.append("<option value=\"" +m+ "\">" +m+ "月</option>");
74. }
75. }
76. /*写日*/
77. if(Month==2 && isPinYear(Year)){DayMax++;} setTimeDay(DayMax);
79. /*写时*/
80. for (var i = 0; i < 24; i++) {
81. var v = i>9 ? i : "0"+i;
82. if(v == Hour){
83. TimeHour.append("<option value=\"" +v+ "\" selected >" +v+ "时</option>");
84. }else{
85. TimeHour.append("<option value=\"" +v+ "\">" +v+ "时</option>");
86. }
87. }
88. /*写分*/
89. for (var i = 0; i < 60; i++) {
90. var v = i>9 ? i : "0"+i;
91. if(v == Minute){
92. TimeMinute.append("<option value=\"" +v+ "\" selected >" +v+ "分</option>");
93. }else{
94. TimeMinute.append("<option value=\"" +v+ "\">" +v+ "分</option>");
95. }
96. }
97. /*写秒*/
98. for (var i = 0; i < 60; i++) {
99. var v = i>9 ? i : "0"+i;
100. if(v == Second){
101. TimeSecond.append("<option value=\"" +v+ "\" selected >" +v+ "秒</option>");
102. }else{
103. TimeSecond.append("<option value=\"" +v+ "\">" +v+ "秒</option>");
104. }
105. }
106. setTimeShow();
108. /*年发生变化时日期发生变化(主要是判断闰平年)*/
109. function YearDay(value){
110. var mvalue = TimeMonth.val();
111. if (mvalue == "") { optionsClear(TimeDay); return; }
113. var dvalue = MonthHead[mvalue-1];
114. if (mvalue == 2 && isPinYear(value)) dvalue++;
115. setTimeDay(dvalue);
116. }
117. /*月发生变化时日期联动*/
118. function MonthDay(value) {
119. var yvalue = TimeYear.val();
120. if (yvalue == "") { optionsClear(TimeDay); return; }
122. var dvalue = MonthHead[value-1];
123. if (value == 2 && isPinYear(yvalue)) dvalue++;
124. setTimeDay(dvalue);
125. }
126. /*据条件写日期*/
127. function setTimeDay(dvalue){
128. optionsClear(TimeDay);
129. for (var i=1; i<(dvalue+1); i++){
130. var d = i>9 ? i : "0"+i;
131. if(d == Day){
132. TimeDay.append("<option value=\"" +d+ "\" selected >" +d+ "日</option>");
133. }else{
134. TimeDay.append("<option value=\"" +d+ "\">" +d+ "日</option>");
135. }
136. }
137. setTimeShow();
138. }
140. /*
141. //赋值
142. function setTimeShow(){
143. var time = TimeYear.val()+"-"+TimeMonth.val()+"-"+TimeDay.val()+" "+TimeHour.val()+":"+TimeMinute.val()+":"+TimeSecond.val();
144. TimeShow.attr("value",time);
145. }
146. */
148. /*判断是否闰平年*/
149. function isPinYear(year){
150. return (0 == year%4 && (year%100 != 0 || year%400 == 0));
151. }
152. /*清空下拉列表*/
153. function optionsClear(o){o.empty();}
154. </script>
155. </body>
156. </html>
来源：
http://blog.csdn.net/jspgen/article/details/7166318
相关阅读:
vue-loader
slot内容分发
 单向数据流
 vue父子组件（1.0）
vue组件
 vue过渡
 vue之自定义组件
 jquery下拉菜单
 vue之过滤器
 【数学】数学归纳法
原文地址：https://www.cnblogs.com/ggbbeyou/p/2308346.html