본문 바로가기

Programming/과거포스팅

javascript 로 select option 넣어주기


제가 직접 만든거고 잘 되는거 확인했습니다.

첫번째 function onload로 호출하시고
두번째 function 은 onchange로 호출하시면 됩니다.
<select id="basicYear" name="basicYear" style="width:106px;" onchange="javascript:addDateOption();">
</select>


body엔 이렇게만 해주시면 자바스크립트를 통해서 옵션이 자동 생성됩니다
이스크립트가 하는 역할은 올해년도부터 3년전년도 위로는 3년후까지 생성이 됩니다
만약옵션에 다음과 같은 값들이 들어있을때

2010
2011
2012
2013
2014

2011을 선택하게 되면 다시 자바스크립트를 통해서 2011을 기준으로 3년전부터 3년후까지의 값을 동적으로 바꾸는 코드입니다.

유용하게 쓰일때가 있을겁니다.


function thisYear()
 {
  var date = new Date();
  var thisYear = date.getFullYear();
  var selectValue = document.getElementById("basicYear");
  var optionIndex = 0;
  for(var i=thisYear-3;i<thisYear+4;i++)
  {
   if(i==thisYear) {selectValue.add(new Option(i+"년",i,true,true),optionIndex++);} 
   else{selectValue.add(new Option(i+"년",i),optionIndex++);}                             }
 }
 
 function addDateOption()
 {
  var tarobj = document.getElementById("basicYear");                                    
  var selectYear =document.getElementById("basicYear").value;
  var optionIndex = 0;
  while(tarobj.options[0]!==null)tarobj.options[0]=null;          
  for(var a = selectYear-3; a < Number(selectYear)+4;a++)
  {
   if(a==selectYear) {tarobj.add(new Option(a+"년",a,true,true),optionIndex++);}
   else    {tarobj.add(new Option(a+"년",a),optionIndex++);}
  }