当前位置:首页 > 全栈分享 > JavaScript > 正文
生日选择代码
发布时间:2017-09-19 21:51:45作者:魏义齐阅读:()评论:
今天给客户做手机网页,需要做生日选择,自己写太麻烦,就在网上找的代码,觉得还不错在此分享出来,希望能帮到大家。
HTML代码:
- <div class="date1">
- <span>出生日期:</span>
- <select onchange="setDays()">
- </select>
- <span>年</span>
- <select onchange="setDays()">
- </select>
- <span>月</span>
- <select>
- </select>
- <span>日</span>
- </div>
js代码:
- <script type="text/javascript">
- window.onload = function () {
- var selects = document.getElementsByTagName("select");//通过标签名获取select对象
- var date = new Date();
- var nowYear = date.getFullYear();//获取当前的年
- for (var i = nowYear - 100; i <= nowYear; i++) {
- var optionYear = document.createElement("option");
- optionYear.innerHTML = i;
- optionYear.value = i;
- selects[0].appendChild(optionYear);
- }
- for (var i = 1; i <= 12; i++) {
- var optionMonth = document.createElement("option");
- optionMonth.innerHTML = i;
- optionMonth.value = i;
- selects[1].appendChild(optionMonth);
- }
- getDays(selects[1].value, selects[0].value, selects);
- }
- // 获取某年某月存在多少天
- function getDaysInMonth(month, year) {
- var days;
- if (month == 1 || month == 3 || month == 5 || month == 7 || month == 8 || month == 10 || month == 12) {
- days = 31;
- } else if (month == 4 || month == 6 || month == 9 || month == 11) {
- days = 30;
- } else {
- if ((year % 4 == 0 && year % 100 != 0) || (year % 400 == 0)) { // 判断是否为润二月
- days = 29;
- } else {
- days = 28;
- }
- }
- return days;
- }
- function setDays() {
- var selects = document.getElementsByTagName("select");
- var year = selects[0].options[selects[0].selectedIndex].value;
- var month = selects[1].options[selects[1].selectedIndex].value;
- getDays(month, year, selects);
- }
- function getDays(month, year, selects) {
- var days = getDaysInMonth(month, year);
- selects[2].options.length = 0;
- for (var i = 1; i <= days; i++) {
- var optionDay = document.createElement("option");
- optionDay.innerHTML = i;
- optionDay.value = i;
- selects[2].appendChild(optionDay);
- }
- }
- </script>
相关阅读
上一篇:屏蔽终端的js代码下一篇:网站通用使文章图片相册式预览、左右滑动、自动切换、双击手捏放大缩小的方法
收起二维码
原创不易,您的赞助就是博主更新的动力!
赞助请备注,8.88元及以上可在赞助光荣榜留下外链信息。
完全自托管的评论系统
最新会员
-
东方星雨
-
deanhan
-
1264822519
-
aini3311
-
a1051020101
-
weiyiqi
- 网站防扒的一般措施(2517)
- js实现刷新页面所有微信号同步变化的效果(1780)
- 网站通用使文章图片相册式预览、左右滑动、自动切换、双击手捏放大缩小的方法(1270)
- 用swiper4给博客首页配置的一个3D方块切换轮播图(1033)
- 随页面滚动动态加载内容的实现方法(977)
- 点击文字即可将文字复制到粘贴板的实现方法(938)
- 打开页面自动滚动到指定位置的实现方法(937)
- slide Toggle()方法如何先后执行两次(621)
- 生日选择代码(594)
- 屏蔽终端的js代码(584)
- js给文章外链添加rel="nofollow",内链则自动排除(2022-01-08)
- 给文章代码高亮模块增加一键复制功能(2021-08-23)
- jQuery解决谷歌广告不显示但使打底广告无法点击问题(2021-08-12)
- 网站通用使文章图片相册式预览、左右滑动、自动切换、双击手捏放大缩小的方法(2019-06-10)
- 用swiper4给博客首页配置的一个3D方块切换轮播图(2018-10-29)