一、年月日选择器
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 < select id="nian" onclick="biantian()"></ select >年 < select id="yue" onclick="biantian()"></ select >月 < select id="tian"></ select >日 < script type="text/javascript"> FillNian(); FillYue(); FillTian(); function FillNian() { var b = new Date(); var nian = parseInt(b.getFullYear()); var str = ""; for(var i=nian-5;i< nian +6;i++) { str = str+"<option value='"+i+"'>"+i+"</ option >"; } document.getElementById("nian").innerHTML = str; } //月数 function FillYue() { var str = ""; for(var i=1;i< 13 ;i++) { str = str+"<option value='"+i+"'>"+i+"</ option >"; } document.getElementById("yue").innerHTML = str; } //每月天数的变化 function FillTian() { var yue = document.getElementById("yue").value; var nian = document.getElementById("nian").value; var ts = 31; //30号的月数 if(yue==4 || yue==6 || yue==9 || yue==11) { ts=30; } //2月不同年的天 if(yue==2) { if((nian%4==0 && nian0 != 0) || nian@0==0) { ts = 29; } else { ts = 28; } } var str = ""; for(var i=1;i< ts +1;i++) { str = str+"<option value='"+i+"'>"+i+"</ option >"; } document.getElementById("tian").innerHTML = str; } function biantian() { FillTian(); } </ script > </ body >
二、选择好友
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 样式: < style type="text/css"> *{ margin:0px auto; padding:0px} #wai{ width:150px; height:300px;} .list{ width:150px; height:40px; background-color:#66F; text-align:center; line-height:40px; vertical-align:middle; color:white; border:1px solid white;} .list:hover{ cursor:pointer; background-color:#00C} </ style > < body >< br > < div id="wai"> < div class="list" onclick="xuan(this)" onmouseover="bian(this)" onmouseout="huifu()">淄博</ div > < div class="list" onclick="xuan(this)" onmouseover="bian(this)" onmouseout="huifu()">张店</ div > < div class="list" onclick="xuan(this)" onmouseover="bian(this)" onmouseout="huifu()">桓台</ div > </ div > </ body > < script type="text/javascript"> function xuan(d) { //清原来的颜色 var list = document.getElementsByClassName("list"); for(var i=0;i< list.length ;i++) { list[i].removeAttribute("bs"); list[i].style.backgroundColor = "#66F"; } //选 d.setAttribute("bs",1); d.style.backgroundColor = "#00C"; } function bian(d) { //清 var list = document.getElementsByClassName("list"); for(var i=0;i<list.length;i++) { if(list[i].getAttribute("bs")!="1") { list[i].style.backgroundColor = "#66F"; } } //选 d.style.backgroundColor = "#00C"; } function huifu() { var list = document.getElementsByClassName("list"); for(var i=0;i<list.length;i++) { if(list[i].getAttribute("bs")!="1") { list[i].style.backgroundColor = "#66F"; } } } </script>