年月日联动

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<form name="form1">
    <!--年份和月份设置联动-->
    <select name="YYYY" onchange="YYYYMM(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>
    window.onload=function () {
        strYYYY = document.form1.YYYY.outerHTML;
        strMM = document.form1.MM.outerHTML;
        strDD = document.form1.DD.outerHTML;
        monHead = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
        var y = new Date().getFullYear();
        var str = strYYYY.substring(0, strYYYY.length - 9);
        for (var i = (y - 118); i < (y + 82); i++) {
            str += "<option value='" + i + "'>" + i + "</option>\n";
        }
        str += "</selet>"
        document.form1.YYYY.outerHTML = str;

        var str1 = strMM.substring(0, strMM.length - 9);
        for (var j = 1; j < 13; j++) {
            str1 += "<option value='" + j + "'>" + j + "</option>\n";
        }
        document.form1.MM.outerHTML = str1 + "</select>";
        y = document.form1.YYYY.value;
        document.form1.MM.value = new Date().getMonth() + 1;
        var n = monHead[new Date().getMonth()];
        if (new Date().getMonth() == 1 && ispinyear(YYYYvalue)) {
            n++;
        }
        writeDay(n);
        document.form1.DD.value = new Date().getDate();
    }
        function writeDay(n){
            var s = strDD.substring(0, strDD.length - 9);
            for (var i=1; i<(n+1); i++)
                s += "<option value='" + i + "'> " + i + "</option>\n";
            document.form1.DD.outerHTML = s +"</select>";
        }
        function YYYYMM(str) //年发生变化时日期发生变化(主要是判断闰平年)
        {
            //把选择的下标位置传给option然后取值
            var MMvalue = document.form1.MM.options[document.form1.MM.selectedIndex].value;
            if (MMvalue == ""){document.form1.DD.outerHTML = strDD; return;}
            var n = monHead[MMvalue - 1];
            if (MMvalue ==2 && ispinyear(str)) n++;
            writeDay(n)
        }
        function MMDD(str1) //月发生变化时日期联动
        {
            var YYYYvalue = document.form1.YYYY.options[document.form1.YYYY.selectedIndex].value;
            if (str1 == ""){document.form1.DD.outerHTML = strDD; return;}
            var n = monHead[str1 - 1];
            if (str1 ==2 && ispinyear(YYYYvalue)) n++;
            writeDay(n)
        }
        function writeDay(n) //据条件写日期的下拉框
        {
            var s = strDD.substring(0, strDD.length - 9);
            for (var i=1; i<(n+1); i++)
                s += "<option value='" + i + "'> " + i + "</option>\r\n";
            document.form1.DD.outerHTML = s +"</select>";
        }
        function ispinyear(year)//判断是否闰平年
        {
            return(0 == year%4 && (year%100 !=0 || year%400 == 0))
        }

</script>
</body>
</html>
猜你喜欢
