这个功能是大学时自己使用纯JavaScript写的,没有借助Jquery,呵呵呵,看起来有点繁琐,可是在当时依稀的记得功能实现后自己好好的高兴一把了呢,从现在来看那时候的自己是多么的幼稚、多么的无知:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title>年月日三级联动(默认显示系统时间)</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> <script type="text/javascript"> function removeChilds(id){ var childs = document.getElementById(id).childNodes;//这一行代码和紧跟的下面的for循环用于清除原来日的下拉列表的select中的对节点 for(var i=childs.length-1;i>=0;i--) { document.getElementById(id).removeChild(childs[i]); } } function setDay(){ var yearToDate=document.getElementById("year").value; var monthToDate=document.getElementById("month").value; //alert(yearToDate+":"+monthToDate); var days=new Array(28,29,30,31); var nowDate=new Date(); if(monthToDate==1||monthToDate==3||monthToDate==5||monthToDate==7||monthToDate==8||monthToDate==10||monthToDate==12){ removeChilds("day"); for( i=1; i<=days[3]; i++ ){ if(yearToDate==nowDate.getFullYear()&&monthToDate==(nowDate.getMonth()+1)&&i==nowDate.getDate()){//如果是当前系统时间则设置默认的日 var newOption = document.createElement("option");newOption.setAttribute("value",i);newOption.setAttribute("selected","selected"); var textToNewOption=document.createTextNode(i);newOption.appendChild(textToNewOption); document.getElementById("day").appendChild(newOption); }else{ var newOption = document.createElement("option");newOption.setAttribute("value",i); var textToNewOption=document.createTextNode(i);newOption.appendChild(textToNewOption); document.getElementById("day").appendChild(newOption); } } } if(monthToDate==4||monthToDate==6||monthToDate==9||monthToDate==11){ removeChilds("day"); for( i=1; i<=days[2]; i++ ){ if(yearToDate==nowDate.getFullYear()&&monthToDate==(nowDate.getMonth()+1)&&i==nowDate.getDate()){//如果是当前系统时间则设置默认的日 var newOption = document.createElement("option");newOption.setAttribute("value",i);newOption.setAttribute("selected","selected"); var textToNewOption=document.createTextNode(i);newOption.appendChild(textToNewOption); document.getElementById("day").appendChild(newOption); }else{ var newOption = document.createElement("option");newOption.setAttribute("value",i); var textToNewOption=document.createTextNode(i);newOption.appendChild(textToNewOption); document.getElementById("day").appendChild(newOption); } } } if(monthToDate==2){ removeChilds("day"); if(yearToDate%400==0||yearToDate%100!=0&&yearToDate%4==0){//闰年 for( i=1; i<=days[1]; i++ ){ if(yearToDate==nowDate.getFullYear()&&monthToDate==(nowDate.getMonth()+1)&&i==nowDate.getDate()){//如果是当前系统时间则设置默认的日 var newOption = document.createElement("option");newOption.setAttribute("value",i);newOption.setAttribute("selected","selected"); var textToNewOption=document.createTextNode(i);newOption.appendChild(textToNewOption); document.getElementById("day").appendChild(newOption); }else{ var newOption = document.createElement("option");newOption.setAttribute("value",i); var textToNewOption=document.createTextNode(i);newOption.appendChild(textToNewOption); document.getElementById("day").appendChild(newOption); } } } else{ for( i=1; i<=days[0]; i++ ){ if(yearToDate==nowDate.getFullYear()&&monthToDate==(nowDate.getMonth()+1)&&i==nowDate.getDate()){//如果是当前系统时间则设置默认的日 var newOption = document.createElement("option");newOption.setAttribute("value",i);newOption.setAttribute("selected","selected"); var textToNewOption=document.createTextNode(i);newOption.appendChild(textToNewOption); document.getElementById("day").appendChild(newOption); }else{ var newOption = document.createElement("option");newOption.setAttribute("value",i); var textToNewOption=document.createTextNode(i);newOption.appendChild(textToNewOption); document.getElementById("day").appendChild(newOption); } } } } } function getMonth(){ var m; for(m=1;m<=12;m++) { if((new Date().getMonth()+1)==m){ document.write("<option value="+m+" selected=\"selected\">"+m+"</option>"); }else{ document.write("<option value="+m+">"+m+"</option>"); } } } function getYear(){ var y; var date=new Date(); var fullYear=date.getFullYear(); for(y=fullYear-60;y<=fullYear;y++){ if(y==fullYear){ document.write("<option value="+y+" selected=\"selected\">"+y+"</option>"); }else{ document.write("<option value="+y+" >"+y+"</option>"); } } } </script> </head> <body> <select name="year" id="year" onChange="setDay();"><script type="text/javascript">getYear();</script></select>年 <select name="month" id="month" onChange="setDay()"><script type="text/javascript">getMonth();</script></select>月 <select name="day" id="day"><script type="text/javascript">setDay();<!--起到初始化日的作用。--></script></select>日 </body> </html>
关于时间的操作(JavaScript版)——年月日三级联动(默认显示系统时间),布布扣,bubuko.com
关于时间的操作(JavaScript版)——年月日三级联动(默认显示系统时间)
原文地址:http://blog.csdn.net/gaohuanjie/article/details/35263317