<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title>年月日三下拉框联动</title>
<meta http-equiv='Content-Type' content='text/html; charset=gb2312'>
</head>

<body>
<form name="reg_testdate">
  <select name="YYYY" onchange="YYYYDD(this.value)">
    <option value="">请选择 年</option>
  </select>
  <select name="MM" onchange="MMDD(this.value)">
    <option value="">选择 月</option>
  </select>
  <select name="DD">
    <option value="">选择 日</option>
  </select>
</form>
<script language="JavaScript"><!--  
   function YYYYMMDDstart()  
   {  
           MonHead = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];  
   
           //先给年下拉框赋内容  
           var y  = new Date().getFullYear();  
           for (var i = (y-30); i < (y+30); i++) //以今年为准，前30年，后30年  
                   document.reg_testdate.YYYY.options.add(new Option(" "+ i +" 年", i));  
   
           //赋月份的下拉框  
           for (var i = 1; i < 13; i++)  
                   document.reg_testdate.MM.options.add(new Option(" " + i + " 月", i));  
   
           document.reg_testdate.YYYY.value = y;  
           document.reg_testdate.MM.value = new Date().getMonth() + 1;  
           var n = MonHead[new Date().getMonth()];  
           if (new Date().getMonth() ==1 && IsPinYear(YYYYvalue)) n++;  
                writeDay(n); //赋日期下拉框Author:meizz  
           document.reg_testdate.DD.value = new Date().getDate();  
   }  
   if(document.attachEvent)  
       window.attachEvent("onload", YYYYMMDDstart);  
   else  
       window.addEventListener('load', YYYYMMDDstart, false);  
   function YYYYDD(str) //年发生变化时日期发生变化(主要是判断闰平年)  
   {  
           var MMvalue = document.reg_testdate.MM.options[document.reg_testdate.MM.selectedIndex].value;  
           if (MMvalue == ""){ var e = document.reg_testdate.DD; optionsClear(e); return;}  
           var n = MonHead[MMvalue - 1];  
           if (MMvalue ==2 && IsPinYear(str)) n++;  
                writeDay(n)  
   }  
   function MMDD(str)   //月发生变化时日期联动  
   {  
        var YYYYvalue = document.reg_testdate.YYYY.options[document.reg_testdate.YYYY.selectedIndex].value;  
        if (YYYYvalue == ""){ var e = document.reg_testdate.DD; optionsClear(e); return;}  
        var n = MonHead[str - 1];  
        if (str ==2 && IsPinYear(YYYYvalue)) n++;  
       writeDay(n)  
   }  
   function writeDay(n)   //据条件写日期的下拉框  
   {  
           var e = document.reg_testdate.DD; optionsClear(e);  
           for (var i=1; i<(n+1); i++)  
                e.options.add(new Option(" "+ i + " 日", i));  
   }  
   function IsPinYear(year)//判断是否闰平年  
   {     return(0 == year%4 && (year%100 !=0 || year%400 == 0));}  
   function optionsClear(e)  
   {  
        e.options.length = 1;  
   }  
   //--></script>
</body>
</html>

html年月日下拉联动菜单 年月日三下拉框联动的更多相关文章

  1. [ PHP+jQuery ] ajax 多级联动菜单的应用：电商网站的用户地址选择功能 ( 二 ) - 仿亚马逊下拉面板

    /** jQuery version: 1.8.3 Author: 小dee Date: 2014.11.8 */ 接上一篇博客. 实现带缓存的仿亚马逊下拉面板 效果图: 图1 初始 图2 点击省份 ...

  2. iOS开发笔记13:顶部标签式导航栏及下拉分类菜单

    当内容及分类较多时,往往采用顶部标签式导航栏,例如网易新闻客户端的顶部分类导航,最近刚好有这样的应用场景,参考网络上一些demo,实现了这种导航效果,记录一些要点. 效果图(由于视频转GIF掉帧,滑动 ...

  3. MDNavBarView下拉导航菜单（仿美团导航下拉菜单）

    说到下拉导航菜单这个东西用得还真不少,细心算一下做开发以来这样的菜单已经写了第三次了,但基本都是不能复用.感觉特累人.不经意看到同事写一个类似的下拉菜单,但他引用了开源库仿大众菜单的库,大致看了一下, ...

  4. 为下拉式菜单(DropDownList)添加第一个选项

    很多方法可以为为下拉式菜单(DropDownList)添加第一个选项,下面是Insus.NET小结了几个方法,仅供参考: Html code: <body>    <form id= ...

  5. Web前端开发实战1：二级下拉式菜单之CSS实现

    二级下拉式菜单在各大学校站点.电商类站点.新闻类站点等大型?站点非经常见,那么它的实现原理是什么呢? 学习了Web前端开发的知识后,我们是能够实现这种功能的.复杂的都是从基础效果上加入做出来的.原理和 ...

  6. Web前端开发实战6：CSS实现导航菜单结合二级下拉式菜单的简单变换

    前面几篇博文都在讲导航菜单和二级下拉式菜单,事实上有非常多方法都能够实现的.详细的情况还要视情况而定. 在后面学习到jQuery框架之后,会有更丰富的动画效果.因为在学习Ajax和jQuery的初步阶 ...

  7. 一个很好的JS,ASP二级下拉框联动。

    在我们制作网站会员注册信息时,一般会涉及到填写自己所在省/市,如果用input或textarea做成填写形式不太理想.所以大部分网站都会选择联动下来列表形式,做起来也不算很复杂,同时看上去也很轻松. ...

  8. Ajax jQuery下拉框联动案例

    需求: 使用ajax和jQuery实现下拉框联动. 注意:需要加入jquery-2.1.1.min.js 前台 <!DOCTYPE html> <html> <head& ...

  9. ajax技术实现登录判断用户名是否重复以及利用xml实现二级下拉框联动，还有从数据库中获得

    今天学了ajax技术,特地在此写下来作为复习. 一.什么是ajax? 客户端(特指PC浏览器)与服务器,可以在[不必刷新整个浏览器]的情况下,与服务器进行异步通讯的技术  即,AJAX是一个[局部刷新 ...

随机推荐

  1. DataGridView的自定义列排序

    1,将需要进行排序的列做属性的设置 this.colUserName.SortMode = DataGridViewColumnSortMode.Programmatic; 2,添加列的事件 //点击 ...

  2. 获取某个数据所在数据列表中的行数 mysql

    select * from (select @rownum := @rownum+1 as rownum,goods_idfrom table_goods, (select @rownum:=0) t ...

  3. /proc/cpuinfo zz

    /proc/cpuinfo文件分析 在Linux系统中,提供了proc文件系统显示系统的软硬件信息.如果想了解系统中CPU的提供商和相关配置信息,则可以通过/proc/cpuinfo文件得到.本文章针 ...

  4. ubuntu su 密码

    Ubuntu的默认root密码是随机的,即每次开机都有一个新的root密码. Ubuntu刚安装后,不能在terminal中运行su命令,因为root没有默认密码,需要手动设定.以安装ubuntu时输 ...

  5. gitlab配置和搭建 ssh

    (1)查看自己之前是否生成过ssh密钥: cat ~/.ssh/id_rsa.pub 如果出现一段ssh-rsa开头的,表示已经生成了,可以跳过此步骤: (2)如果之前没有生成ssh密钥,使用命令: ...

  6. ubuntu下导入kali源

    Kali-Linux之前的渗透神器BackTrack是基于Ubuntu的,界面比较友好,字体渲染看起来也比较舒服(也可能是本人用惯了 Ubuntu的缘故).后来官方终止BackTrack,开发Kali ...

  7. ALV详解：OO SALV

    声明:原创作品,转载时请注明文章来自SAP师太技术博客( 博/客/园www.cnblogs.com):www.cnblogs.com/jiangzhengjun,并以超链接形式标明文章原始出处,否则将 ...

  8. [SAP ABAP开发技术总结]OPEN SQL

    声明:原创作品,转载时请注明文章来自SAP师太技术博客( 博/客/园www.cnblogs.com):www.cnblogs.com/jiangzhengjun,并以超链接形式标明文章原始出处,否则将 ...

  9. C#:常规属性和自动实现的属性

    根据属性的实现方式,属性可分为自动实现的属性和常规属性. 常规属性需要具体的人为的实现get访问器或者set访问器,而且一般需要有一个字段与之相对应:而自动实现的属性的get和set访问器的实现部分被 ...

  10. So easy Webservice 2.WebService介绍

    WebService概念介绍: Web Service是一项新技术, 能使得运行在不同机器上的不同应用无须借助附加的.专门的第三方软件或硬件, 就可相互交换数据或集成.依据Web Service规范实 ...