非常简单的javascript年-月-日三级联动下拉框
<html> <head> <title>年月日三下拉框联动</title> <meta http-equiv='Content-Type' content='text/html; charset=gb2312'> <meta name='author' content='oiea'> <script language="JavaScript"> <!-- function initDate(year,month,day) { //每个月的初始天数 MonDays = ; //当前的年份 var y = new Date().getFullYear(); //当前的月份 var m = new Date().getMonth()+1; //javascript月份为0-11 //但前的天份 var d = new Date().getDate(); //以今年为准,向后2年,填充年份下拉框 for (var i = y; i < (y+2); i++) { year.options.add(new Option(i,i)); } //选中今年 year.value=y; //填充月份下拉框 for (var i = 1; i <= 12; i++) { month.options.add(new Option(i,i)); } //选中当月 month.value = m; //获得当月的初始化天数 var n = MonDays; //如果为2月,天数加1 if (m == 2 && isLeapYear(year.options.value)) n++; //填充日期下拉框 createDay(n,day); //选中当日 day.value = new Date().getDate(); } function change(year,month,day) //年月变化,改变日 { var y = year.options.value; var m = month.options.value; //if (m == "" ){clearOptions(day); return;} var n = MonDays; if ( m ==2 && isLeapYear(y)) { n++; } createDay(n,day) } function createDay(n,day) //填充日期下拉框 { //清空下拉框 clearOptions(day); //几天,就写入几项 for(var i=1; i<=n; i++) { day.options.add(new Option(i,i)); } } function clearOptions(ctl)//删除下拉框中的所有选项 { for(var i=ctl.options.length-1; i>=0; i--) { ctl.remove(i); } } function isLeapYear(year)//判断是否闰年 { return( year%4==0 || (year%100 ==0 && year%400 == 0)); } //--> </script> </head> <body > <form name="form1"> <select name="select_year" onchange="change(this, document.form1.select_month, document.form1.select_day)"></select>year <select name="select_month" onchange="change(document.form1.select_year, this,document.form1.select_day)"></select>month <select name="select_day"></select>day </form> </body> </html>
页:
[1]