<!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>
        <meta charset="UTF-8"/>
        <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
        <title>JS年月日三级联动下拉框日期选择代码</title>
    </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>

JS年月日三级联动下拉框日期选择代码的更多相关文章

  1. Android实现三级联动下拉框 下拉列表spinner

    Android实现(省.市.县)三级联动下拉框 下拉列表spinner 转载请注明出处: http://www.goteny.com/articles/2013/11/46.html http://w ...

  2. Web 1三级联动 下拉框 2添加修改删除 弹框

    Web  三级联动 下拉框 using System; using System.Collections.Generic; using System.Linq; using System.Web; u ...

  3. jquery+html三级联动下拉框

    jquery+html三级联动下拉框及详情页面加载时的select初始化问题   html写的三个下拉框,如下: <select name="ddlQYWZYJ" id=&q ...

  4. jquery+ligerform三级联动下拉框

    如下为ligerform里的三级联动下拉框: var formData=[ {display:,width:,space:,type:"select",group:"区域 ...

  5. 项目总结01：JSP mysql SpringMvc下中国省市县三级联动下拉框

    JSP mysql SpringMvc下中国省市县三级联动下拉框 关键词 JSP  mysql数据库  SpringMvc  ajax   Controller层  Service层  中国地区  省 ...

  6. Vue.js组件之联动下拉框

    Html代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...

  7. JQ与AJAX 省市区三级联动下拉框

    用于初学者学习基本的联动下拉框,废话不多说,见代码 首先看控制器里的3个下拉框对应代码: public ActionResult GetProvinceList() { ProvinceReposit ...

  8. jquery+html三级联动下拉框及详情页面加载时的select初始化问题

    html写的三个下拉框,如下: <select name="ddlQYWZYJ" id="ddl_QYWZYJ" class="fieldsel ...

  9. Android实现三级联动下拉框下拉列表spinner

    原文出处:http://www.cnblogs.com/zjjne/archive/2013/10/03/3350107.html 主要实现办法:动态加载各级下拉值的适配器 在监听本级下拉框,当本级下 ...

随机推荐

  1. Asp.net MVC学习--默认程序结构、工作流程

    二.MVC 默认程序结构 MVC新建好之后,会对应的出现几个包,分别是:Controller.Model.View --即MVC 其中的默认的Default.aspx文件可以方便url重写,如果不设置 ...

  2. 解密电子书之四：MCU（freescale）

    谈完国产的君正,让我们再看看呛了君正财路的freescale iMX51. 这是freescale近期的主打产品,用的是ARM Cortex A8架构,主频在消费电子领域最高可达800MHz,在工业领 ...

  3. 微软 Office 2010 SP2 正式版下载大全（含简中）

    7月24日消息,微软正式为 Office 2010 和 SharePoint 2010 系列产品发布 SP 2服务包,带来重要更新和修复.除了提供产品补丁,SP2服务包还将提升产品的稳定性.性能以及安 ...

  4. shell脚本中常见的一些特殊符号和作用详解

    这篇文章主要介绍了shell脚本中常见的一些特殊符号和它的作用详解,总结的很简洁,容易看懂,需要的朋友可以参考下   在编写Shell脚本时,我们需要会用到各种各样的特殊符号,通过这些特殊符号可以使我 ...

  5. NOI2015 Day2

    NOI2015 Day2 荷马史诗 题目描述:给出\(n\)个数,要求\(n\)个\(k\)进制数来对应这\(k\)个数(允许有前导零),\(n\)个\(k\)进制数互不为前缀,求\(n\)个数乘以对 ...

  6. uber在限制新司机加入了，看看新政策把

    您可以点击“车主奖励分组查询”输入您在系统注册的手机号查询您所在奖励分组 5月25日-5月31日 奖励明细 1. 成都优步合作车主第一组 奖励政策: (账户激活时间在2015年5月29日之前) *以下 ...

  7. Java面试题之四

     十六.运行时异常与一般异常有何异同 Java提供了两类主要的异常:runtime exception和checked exception. 1.checked exception:这种异常也就是我们 ...

  8. Java Dom解析xml

    Dom解析是将xml文件全部载入,组装成一颗dom树,然后通过节点以及节点之间的关系来解析xml文件,下面结合这个xml文件来进行dom解析. <?xml version="1.0&q ...

  9. WPF基础——继承

    1)  可以定义继承自其他类的类,关系是“父类/子类”.子类继承父类的成员(不严谨) 2)  定义语法“class子类:父类”,不指定父类则父类为Object,.Net中所有类都直接或者间接继承自Ob ...

  10. SQL学习之汇总数据之聚集函数

    一. 1.我们经常需要汇总数据而不用把他们实际检索出来,为此SQL提供了专门的函数,以便于分析数据和报表生成,这些函数的功能有: (1)确定表中行数(或者满足单个条件或多个条件或包含某个特定值的行数) ...