javascript : select_box 년도별로 나오게 하기

 

 

[HTML]

 <select class="form-select form-md" id="year" name="year">
                </select>
                <span>년</span>

 

[JS]

 

$(document).ready(function() {
  setDatSelectBox();
});


function setDatSelectBox() {
  let now = new Date();
  let now_year = now.getFullYear();

  $("#year").append("<option value=''>선택 </option>");

  //올해부터 10년뒤
  for(let i = now_year; i <= 2034; i++){
    $("#year").append("<option value='"+ i +"'> "+ i + "</option>");
  }
}

 

1.  setDatSelectBox 라는 함수에 년도를 넣을 로직을 구현할 것 이다.

2. new Date () => 현재 날짜 및 시간

3. new_year 이라는 변수엔 now.getFullYear ()  즉, 연도만 갖고와 변수에 값을 저장해준다.

4. 나는 2024년 부터 앞으로의 10년의 값들을 불러오고 싶다.

5. for 문을 통해 now_year <= 2034 만큼 반복문을 돌려준다.

6. id 값이 year 인 요소를 찾아 append (즉, 마지막 부분에 추가해줌) <option value='" + i + "'> " + i + " </option> 을 추가해준다.