TOP /すぐに使えるJavaScript セレクトボックスカレンダー(閏年対応)

日( 曜日)
<form name="dateform">
<SELECT name="yy"onchange="yearcheck(this.value)">
</SELECT>年
<SELECT name="mm"onchange="monthcheck(this.value)">
</SELECT>月
<SELECT name="dd"onchange="datecheck(this.value)">
</SELECT>日(
<input name="day"type="text"size=1 readonly 
style="background-color:transparent;border-style:none;font-size:14px">曜日)
</form>

<script type="text/javascript"><!--
valueyear=5;         //何年表示するか
backyear=1;          //何年前まで表示するか
suncolor="#ffbbff"   //日曜日の色
satcolor="#77eeff"   //土曜日の色
//----------------------------------------
today = new Date();
yy=today.getYear();
if (yy<2000)yy+=1900;
mm=today.getMonth();
dd=today.getDate();
day=today.getDay();
setday=new Array("日","月","火","水","木","金","土")
for(i=0;i<valueyear;i++){
newoption=new Option(yy-backyear+i,yy-backyear+i);
document.dateform.elements[0].options[i]=newoption;
if(i==backyear)document.dateform.elements[0].options[i].selected=true;
}
for(i=0;i<12;i++){
newoption=new Option(i+1,i+1);
document.dateform.elements[1].options[i]=newoption;
if(i==mm)document.dateform.elements[1].options[i].selected=true;
}
for(i=0;i<31;i++){
if(i+1==new Date(yy+"/"+(mm+1)+"/"+(i+1)).getDate())
newoption=new Option(i+1,i+1);
else
break;
document.dateform.elements[2].options[i]=newoption;
if(i+1==dd)document.dateform.elements[2].options[i].selected=true;
if(0==new Date(yy+"/"+(mm+1)+"/"+(i+1)).getDay())
document.dateform.elements[2].options[i].style.backgroundColor=suncolor;
else if(6==new Date(yy+"/"+(mm+1)+"/"+(i+1)).getDay())
document.dateform.elements[2].options[i].style.backgroundColor=satcolor;
}
document.dateform.elements[3].value=setday[day];
function yearcheck(y){
yy=y;
monthcheck();
}
function monthcheck(m){
datetemp=document.dateform.elements[2].value;
if(m)mm=m-1;
document.dateform.elements[2].innerHTML="";
for(i=0;i<31;i++){
if(i+1==new Date(yy+"/"+(mm+1)+"/"+(i+1)).getDate())
newoption=new Option(i+1,i+1);
else
break;
document.dateform.elements[2].options[i]=newoption;
if(i+1==datetemp)
document.dateform.elements[2].options[i].selected=true;
if(0==new Date(yy+"/"+(mm+1)+"/"+(i+1)).getDay())
document.dateform.elements[2].options[i].style.backgroundColor=suncolor;
else if(6==new Date(yy+"/"+(mm+1)+"/"+(i+1)).getDay())
document.dateform.elements[2].options[i].style.backgroundColor=satcolor;
}
datecheck();
}
function datecheck(d){
dd=(d)?d:document.dateform.elements[2].value;
day=new Date(yy+"/"+(mm+1)+"/"+dd).getDay();
document.dateform.elements[3].value=setday[day];
}/*himajin.moo.jp*/
// --></script>