用JavaScript实现城市联动框时间的联动框：
要求：
年份：1900~今年 月份：1~12 日：根据每月算出对应的天数
代码：
<!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> <script type="text/javascript"> function showCity(){ //维护一个二维数组存储省份对应的城市 var citys = [[],["广州","佛山","中山"],["长沙","衡阳","岳阳"],["南宁","桂林","柳州"]]; //获取省份对应的节点 var provinceNode = document.getElementById("province"); //获取省份选中的选项 var selectIndex = provinceNode.selectedIndex; //获取对应的城市 var cityDatas = citys[selectIndex]; //找到city节点 var cityNode = document.getElementById("city"); //先清空city框的所有option //方法1： /* var children = cityNode.childNodes; for(var i =0 ; i < children.length ;){ cityNode.removeChild(children[i]); } */ //方法2：设置options的个数 cityNode.options.length = 1; //遍历对应的所有城市然后创建对应的option添加到city上； for(var index = 0 ; index < cityDatas.length ; index++){ var option = document.createElement("option"); option.innerHTML = cityDatas[index]; cityNode.appendChild(option); } } function showYear(){ var da = new Date(); var year1 = parseInt(da.getFullYear()); var yearNode = document.getElementById("y"); yearNode.options.length = 1; for(var i = 1900 ; i <= year1 ; i++){ var option = document.createElement("option"); option.innerHTML = i.toString(); yearNode.appendChild(option); } } function showMonth(){ var monthNode = document.getElementById("m"); monthNode.options.length = 1; for(var i = 1 ; i <= 12 ; i++){ var option = document.createElement("option"); option.innerHTML = i.toString(); monthNode.appendChild(option); } } function showDay(){ var days = [0,31,28,31,30,31,30,31,31,30,31,30,31]; //var yNode = document.getElementById("y"); //var yIndex = yNode.selectedIndex; //var yyyy = parseInt(yNode.options[yIndex].text); var yyyy = parseInt(document.getElementById("y").value); //var mNode = document.getElementById("m"); //var mIndex = mNode.selectedIndex; //var mm = parseInt(mIndex); var mm = parseInt(document.getElementById("m").value); if((yyyy%4==0&&yyyy0!=0)||yyyy@0==0){ days[2] = 29; } else{ days[2] = 28; } var dayNode = document.getElementById("d"); dayNode.options.length = 1; for(var i = 1 ; i <= parseInt(days[mm]) ; i++){ var option = document.createElement("option"); option.innerHTML = i.toString(); dayNode.appendChild(option); } } function ready(){ showYear(); } </script> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>城市的联动框</title> </head> <body οnlοad="ready()"> 省份 <select id="province" οnchange="showCity()"> <option>省份</option> <option>广东</option> <option>湖南</option> <option>广西</option> </select> 城市 <select id="city"> <option>城市</option> </select> <hr/> <!--<input type="button" οnclick="showYear()" value="添加"/>--> 年<select id="y" οnchange="showMonth()"> <option>年份</option> </select> 月<select id="m" οnchange="showDay()"> <option>月份</option> </select> 日<select id="d"> <option>日</option> </select> </body> </html>
