select 日期选择

一种最老土，最简单的时间选择写法。
<!doctype html>
<html>
<head>
    <meta charset="utf-8">

</head>
<body>

			 <form name="form1" id="gzRecored" method="post" action="<?php echo $this->getActionUrl('usergzjl'); ?>" class="chkForm"enctype="multipart/form-data">
			 	<div class="team-report" id="team-report">
				    <td valign=top style="padding-top:5px;">
					   	<table cellpadding="0" cellspacing="1" border="0" bordercolor="#ddd" class="report-table" width="100%">
					      <tr>
						    <td colspan=2 align=left style="background-color:#fdfdfd;"><span style="padding-left:5px;"><b>添加服务记录：</b></span></td>
						  </tr>
						  <tr>
  							<td align=left style="background-color:#fdfdfd;"><span style="padding-left:5px;">服务日期：
			                <td align=left>
			                    <select name=st_year id="st_year" onChange="YYYYDD(this.value)">
			                    </select>
			                    年
			                    <select name=st_month onChange="MMDD(this.value)" id="st_month">
			                    </select>
			                    月
			                    <select name=st_day id="st_day">
			                    </select>
			                    日
			                </td>
			              </tr>
						  <tr>
						    <td align=left style="background-color:#fdfdfd;"><span style="padding-left:5px;">服务记录：</span></td><td align=left style="background-color:#fdfdfd;"><span style="padding-left:5px;"><textarea style="380px;height:50px;" name="xtinfo"></textarea></span></td>
						  </tr>
						  <tr>
		                   <td align=left colspan=2 style="background-color:#fdfdfd;"><span style="padding-left:5px;"><input type="submit" value="提交记录" style="120px;height:30px;"></span></td>
		                 </tr>
					   </table>
				   </td>
				<div>
			   </form>

    </div>
</body>
    <script type="text/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 - 80); i <= y; i++) //以今年为准，前30年，后30年
                document.form1.st_year.options.add(new Option(i, i));
            //赋月份的下拉框
            for (var i = 1; i < 13; i++)
                document.form1.st_month.options.add(new Option(i, i));
            document.form1.st_year.value = y;
            document.form1.st_month.value = new Date().getMonth() + 1;
            var n = MonHead[new Date().getMonth()];
            if (new Date().getMonth() == 1 && IsPinYear(y)) n++;
            writeDay(n); //赋日期下拉框
            document.form1.st_day.value = new Date().getDate();
        }
        if (document.attachEvent)
            window.attachEvent("onload", YYYYMMDDstart);
        else
            window.addEventListener('load', YYYYMMDDstart, false);
        function YYYYDD(str) //年发生变化时日期发生变化(主要是判断闰平年)
        {
            var MMvalue = document.form1.st_month.options[document.form1.st_month.selectedIndex].value;
            if (MMvalue == "") {
                var e = document.form1.st_day;
                optionsClear(e);
                return;
            }
            var n = MonHead[MMvalue - 1];
            if (MMvalue == 2 && IsPinYear(str)) n++;
            writeDay(n)
        }
        function MMDD(str) //月发生变化时日期联动
        {
            var YYYYvalue = document.form1.st_year.options[document.form1.st_year.selectedIndex].value;
            if (YYYYvalue == "") {
                var e = document.form1.st_day;
                optionsClear(e);
                return;
            }
            var n = MonHead[str - 1];
            if (str == 2 && IsPinYear(YYYYvalue)) n++;
            writeDay(n)
        }
        function writeDay(n) //据条件写日期的下拉框
        {
            var e = document.form1.st_day;
            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 = 0;
        }
    </script>
</html>
积累知识，分享知识，学习知识。