Web覚書トップ > JavaScript サンプル > 『年月日に合わせて曜日を表示させてみる』
説明

『年月に合わせて日付の項目数を変更する』を拡張して曜日の表示をつけてみます。

実行例
年  月  日 

コード
function setDay(obj){
	obj = obj.form;
	var years = parseInt(obj.years.options[obj.years.selectedIndex].value);
	var months = parseInt(obj.months.options[obj.months.selectedIndex].value);
	var lastday = monthday(years,months);
	var itemnum = obj.days.length;
	if (lastday - 1 < obj.days.selectedIndex) {
		obj.days.selectedIndex = lastday - 1;
	}
	obj.days.length = lastday;
	for (cnt = itemnum + 1;cnt <= lastday;cnt++) {
		obj.days.options[cnt - 1].text  = cnt;
		obj.days.options[cnt - 1].value = cnt;
	}
	setWeek(obj.days);
}
function monthday(years,months){
	var lastday = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
	if (((years % 4 == 0) && (years % 100 != 0)) || (years % 400 == 0)){
		lastday[1] = 29;
	}
	return lastday[months - 1];
}
function setWeek(obj){
	obj = obj.form;
	var week = new Array("(日)","(月)","(火)","(水)","(木)","(金)","(土)");
	var years = parseInt(obj.years.options[obj.years.selectedIndex].value);
	var months = parseInt(obj.months.options[obj.months.selectedIndex].value);
	var days = parseInt(obj.days.options[obj.days.selectedIndex].value);
	var dates = new Date(years,months - 1,days);
	obj.weeks.value = week[dates.getDay()];
}
<FORM>
<SELECT name="years" onChange="setDay(this);">
<OPTION value="2000">2000</OPTION>〜<OPTION value="2002">2002</OPTION>
</SELECT> 
<SELECT name="months" onChange="setDay(this);">
<OPTION value="1" selected>1</OPTION>〜<OPTION value="12">12</OPTION>
</SELECT> 
<SELECT name="days" onChange="setWeek(this);">
<OPTION value="1" selected>1</OPTION>〜<OPTION value="31">31</OPTION>
</SELECT> 
</FORM>

解説&ステップアップ

年と月と日の選択フォームが変更された際に、テキストボックスに曜日を計算して入れているだけです。

動作確認

IE5.0(win)、IE5.5(win)、NN4.7(win)

© hyork@yahoo.co.jp (2001. 5.16)