工作室注册登录标签云赞助光荣榜

当前位置:首页 > 全栈分享 > JavaScript > 正文

生日选择代码

发布时间:2017-09-19 21:51:45作者:魏义齐阅读:()评论:

本文为博主原创文章,未经博主允许不得转载。

今天给客户做手机网页,需要做生日选择,自己写太麻烦,就在网上找的代码,觉得还不错在此分享出来,希望能帮到大家。

HTML代码:

  1. <div class="date1"> 
  2.     <span>出生日期:</span> 
  3.     <select onchange="setDays()"> 
  4.     </select> 
  5.     <span></span> 
  6.     <select onchange="setDays()"> 
  7.     </select> 
  8.     <span></span> 
  9.     <select> 
  10.     </select> 
  11.     <span></span> 
  12. </div>  
js代码:
  1. <script type="text/javascript"
  2.     window.onload = function () { 
  3.         var selects = document.getElementsByTagName("select");//通过标签名获取select对象  
  4.         var date = new Date(); 
  5.         var nowYear = date.getFullYear();//获取当前的年  
  6.         for (var i = nowYear - 100; i <= nowYear; i++) { 
  7.             var optionYear = document.createElement("option"); 
  8.             optionYear.innerHTML = i; 
  9.             optionYear.value = i; 
  10.             selects[0].appendChild(optionYear); 
  11.         } 
  12.         for (var i = 1; i <= 12; i++) { 
  13.             var optionMonth = document.createElement("option"); 
  14.             optionMonth.innerHTML = i; 
  15.             optionMonth.value = i; 
  16.             selects[1].appendChild(optionMonth); 
  17.         } 
  18.         getDays(selects[1].value, selects[0].value, selects); 
  19.     } 
  20.  
  21.     // 获取某年某月存在多少天  
  22.     function getDaysInMonth(month, year) { 
  23.         var days; 
  24.         if (month == 1 || month == 3 || month == 5 || month == 7 || month == 8 || month == 10 || month == 12) { 
  25.             days = 31; 
  26.         } else if (month == 4 || month == 6 || month == 9 || month == 11) { 
  27.             days = 30; 
  28.         } else { 
  29.             if ((year % 4 == 0 && year % 100 != 0) || (year % 400 == 0)) {     // 判断是否为润二月  
  30.                 days = 29; 
  31.             } else { 
  32.                 days = 28; 
  33.             } 
  34.         } 
  35.         return days; 
  36.     } 
  37.  
  38.     function setDays() { 
  39.         var selects = document.getElementsByTagName("select"); 
  40.         var year = selects[0].options[selects[0].selectedIndex].value; 
  41.         var month = selects[1].options[selects[1].selectedIndex].value; 
  42.         getDays(month, year, selects); 
  43.     } 
  44.  
  45.     function getDays(month, year, selects) { 
  46.         var days = getDaysInMonth(month, year); 
  47.         selects[2].options.length = 0; 
  48.         for (var i = 1; i <= days; i++) { 
  49.             var optionDay = document.createElement("option"); 
  50.             optionDay.innerHTML = i; 
  51.             optionDay.value = i; 
  52.             selects[2].appendChild(optionDay); 
  53.         } 
  54.     } 
  55. </script>  

本文标签:,您可以阅读与「」相关的所有文章

魏义齐全栈技术交流:魏义齐全栈技术交流

上一篇:屏蔽终端的js代码下一篇:网站通用使文章图片相册式预览、左右滑动、自动切换、双击手捏放大缩小的方法

原创不易,您的赞助就是博主更新的动力!

赞助请备注,8.88元及以上可在赞助光荣榜留下外链信息。

HashOver畅言云评完全自托管的评论系统

工作室注册登录标签云赞助光荣榜

最新会员
  • 东方星雨
  • deanhan
  • 1264822519
  • aini3311
  • a1051020101
  • weiyiqi