首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

年月日三级上拉菜单

2012-07-05 
年月日三级下拉菜单!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org

年月日三级下拉菜单

<!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 http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script language="javascript" >

function YearMonthDay(){
   fo=document.form1;
   foday=fo.day1;
   MonHead=[31,28,31,30,31,30,31,31,30,31,30,31];

   //add options for year
   y=new Date().getFullYear();
   for(i=(y-80);i<=y;i++)
   fo.year1.options.add(new Option(i,i));
   //fo.year1.options.value=y;//current year

    //add options for month
   m=new Date().getMonth();
   for(i=1;i<=12;i++)
   fo.month1.options.add(new Option(i,i));
   //fo.month1.options.value=m+1;//current month

   //add options for day
   d=new Date().getDate();
   n=MonHead[m];
   if(m==1&&IsRunYear(yearValue))
   n++;
   day(n);
   //fo.day1.options.value=d;//curren day

}

   //onchange of year
function yy(str){
   monthValue=fo.month1.options[fo.month1.selectedIndex].value;
   if(monthValue==""){
      var foday=document.form1.day1;
   optionClear(foday);
   return;
    }
   var n=MonHead[monthValue-1];
   if(monthValue==2&&IsRunYear(str)) n++;
   day(n);
}

   //onchange of month
function mm(ab){
yearValue=fo.year1.options[fo.year1.selectedIndex].value;
if(yearValue==""){
optionClear(foday);
return;
}
var n=MonHead[ab-1];
if(ab==2&&IsRunYear(yearValue)) n++;
day(n);

}

function day(ab){
   optionClear(foday);
 
   for(var i=1;i<=ab;i++)
   foday.options.add(new Option(i,i));
}

function optionClear(ab){
   for(var i=ab.options.length;i>0;i--)
   ab.remove(i);
}

function IsRunYear(year){
   return(0==year%4&&(year%100!=0 || year%400==0));
}
</script>
</head>

 

 

<body onload="YearMonthDay()">
<form name="form1" >

<select name="year1" id="year1"  onchange="yy(this.value)"><option value="" selected>选择</option>
            </select>
        年
        <select name="month1" id="month1" onchange="mm(this.value)"><option value="" selected>选择</option>
                </select>
        月
        <select name="day1" id="day1"><option value="" selected>选择</option>
                </select>
      日


</form>

</body>
</html>

热点排行