Posted
Filed under Htm&Javascript

<script language="javascript" src="jquery-1.3.2.js"></script>
<script language="javascript">

/**

* query를 이용한 날짜 셀렉트 박스

**/
$(function () {
initDaySelect('sYear', 'sMonth', 'sDay');
});

/**
* 년도 역순 셀렉트
* param : s - 시작연도, p - 출력년수, v - 선택값
* date : 2010-05-10
* auth : sunghee (xxda@naver.com)
**/
$.fn.setYearSelect = function(s, p, v){
var tday = new Date()
if(!s){s=tday.getFullYear()};
if(!p){p=5};
if(!v){v=(new Date).getFullYear()};
this.each(function(){
if (this.tagName=='SELECT') {
this.options.length = 0;
for (var i=s;i>s-p;i--){
if ( i == v || i == v)
var option = new Option(i , i, false,true);
else
var option = new Option(i , i);
if ($.browser.msie) { this.add(option);
}else{ this.add(option,null);}
}
}
});
}

/**
* 월 셀렉트
* param : v - 선택값
* date : 2010-05-10
* auth : sunghee (xxda@naver.com)
**/
$.fn.setMonthSelect = function(v){
var tday = new Date();
var tmp = "";
if(!v){v=(new Date).getMonth()+1};
if (v.length < 2) v = '0' + v;
this.each(function(){
if (this.tagName=='SELECT') {
this.options.length = 0;
for (var i=1;i<13;i++){
if(i < 10) tmp = '0' + i;
else tmp = '' + i;
if ( tmp == v || tmp == v)
var option = new Option(tmp , tmp, false,true);
else
var option = new Option(tmp , tmp);
if ($.browser.msie) { this.add(option);
}else{ this.add(option,null);}
}
}
});
}

/**
* 일 셀렉트
* param : ds - 일수, v - 선택값
* date : 2010-05-10
* auth : sunghee (xxda@naver.com)
**/
$.fn.setDaySelect = function(ds, v){
var tmp = "";
if(!v){v=(new Date).getDate()};
if (v.length < 2) v = '0' + v;
this.each(function(){
if (this.tagName=='SELECT') {
this.options.length = 0;
for (var i=1;i<ds+1;i++){
if(i < 10) tmp = '0' + i;
else tmp = '' + i;
if ( tmp == v || tmp == v)
var option = new Option(tmp , tmp, false,true);
else
var option = new Option(tmp , tmp);
if ($.browser.msie) { this.add(option);
}else{ this.add(option,null);}
}
}
});
}

/**
* 날짜 셀렉트 박스에 날짜 세팅
**/
function initDaySelect(yName, mName, dName){
$("#"+yName).setYearSelect();
$("#"+mName).setMonthSelect();
setDaySelect(yName, mName, dName);
}

/**
* 날짜세팅
**/
function setDaySelect(yName, mName, dName){
var days = new Date(new Date($("#"+yName).val(), $("#"+mName).val(), 1)-86400000).getDate();
$("#"+dName).setDaySelect(days, $("#"+dName).val());
}
</script>
<select id="sYear" name="sYear" onchange="setDaySelect('sYear', 'sMonth', 'sDay')"></select> 년
<select id="sMonth" name="sMonth" onchange="setDaySelect('sYear', 'sMonth', 'sDay')"></select> 월
<select id="sDay" name="sDay" onchange="setDaySelect('sYear', 'sMonth', 'sDay')"></select> 일

2012/10/12 15:06 2012/10/12 15:06