日期联动框

来源：互联网发布：淘宝一个好评多少分编辑：程序博客网时间：2024/06/02 03:56

简单实现日期下拉框(1900--2100)

<!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></head><script type="text/javascript">function showYear(){var startYear = 1900;var endYear = 2100;var selectNode = document.getElementsByTagName("select")[0];for(var y = startYear; y<=endYear;y++){var opNode = document.createElement("option");opNode.innerHTML=y;selectNode.appendChild(opNode);}}function showMonth(){var selectNode = document.getElementsByTagName("select")[1];var selectNodes = document.getElementsByTagName("select");var yearOptionNodes = selectNodes[0].childNodes;var year = yearOptionNodes[selectNodes[0].selectedIndex].innerHTML;if(parseInt(year)){if(selectNode.childNodes.length==13){selectNode.selectedIndex =0;}else{for(var m =1; m<13;m++){var opNode = document.createElement("option");opNode.innerHTML=m;selectNode.appendChild(opNode);}}}else{//deletevar monthOptionNodes = selectNodes[1].childNodes;var len =monthOptionNodes.length;for(var j = 1; j < len; j++){selectNodes[1].removeChild(monthOptionNodes<span style="color:#ff0000;"><strong>[1]</strong></span>);}showDay();}}function showDay(){var selectNodes = document.getElementsByTagName("select");var yearOptionNodes = selectNodes[0].childNodes;var year = yearOptionNodes[selectNodes[0].selectedIndex].innerHTML;if(year%4==0&&year%100!=0||year%400==0){var feb = 2;}else{var feb = 1;}var monthOptionNodes = selectNodes[1].childNodes;var month = monthOptionNodes[selectNodes[1].selectedIndex].innerHTML;if(month==1||month==3||month==5||month==7||month==8||month==10||month==12){var days=31;}else if(month==2){var days=27+feb;}else if(month==4||month==6||month==9||month==11){var days=30;}else{var days=0;}//deletevar dayOptionNodes = selectNodes[2].childNodes;var len =dayOptionNodes.length;for(var j = 1; j < len; j++){selectNodes[2].removeChild(dayOptionNodes<strong><span style="color:#ff0000;">[1]</span></strong>);}//addvar selectNode = document.getElementsByTagName("select")[2];for(var i = 1; i<=days;i++){var opNode = document.createElement("option");opNode.innerHTML=i;selectNode.appendChild(opNode);}}</script><body onload="showYear()">年<select onchange="showMonth()"><option>/</option></select>月<select onchange="showDay()"><option>/</option></select>日<select><option>/</option></select></body></html>

没想到这东西都花了好些时间，delete部分碰到BUG搞了好久才发现原因，红框部分需要固定才可以，如果填 j ，随着node的删除，只能删一半了。

纯粹纪录一下。。。

0 0