Skip to content

CHICPRO

  • Life Log
  • Cycling Log
  • Photo Log
    • Portrait
    • Landscape
    • Flower
    • Etc
  • Coding Log
  • Information

[JS] select의 선택된 값 구하기

2013-10-06 by 편리

자바스크립트를 이용해 select 의 선택된 값을 구하는 방법이다. 아래는 간단한 html 문서이다.

<select name="sel" id="sel">
    <option value="">선택</option>
    <option value="1">1</option>
</select>

자바스크립트로 이 select의 선택된 값을 구하는 방법은 두 가지가 있다. 먼저 for문을 이용해 구하는 코드이다.

<script>
var sel = document.getElementById("sel");
var val;

for(i=0; i<sel.options.length; i++) {
    if(sel.options[i].selected == true) {
        val = sel.options[i].value;
        break;
    }
}
</script>

위 코드가 일반적로 많이 쓰이는 코드이다. 위의 코드를 좀 더 단순하게 만든 것이 아래의 코드이다.

<script>
var sel = document.getElementById("sel");
var val = sel.options[sel.selectedIndex].value;
</script>

for문을 작성하지 않고도 select 의 값을 구할 수 있다.

Post navigation

Previous Post:

갤럭시 S4 Zoom 유출샷?

Next Post:

조바심 나와의 싸움

3 Commments

  1. 박한샘 says:
    2016-06-16 at 15:32

    안녕하세요 저도 휴대폰 판매 쇼핑몰을 운영하는데 …혼자 개발하려니 막히는게 많네요
    그래서 사이트 찾다가 이렇게 글을 남깁니다.
    혹시 괜찮으시면 질문좀 드려도 될지 모르겠네요

    function kt1(){

    document.getElementById(“kkk”).innerHTML = ‘500000’;

    }

    미적용
    온가족할인 10년미만 (10%}
    온가족할인 20년미만 (20%}
    온가족할인 30년미만 (30%}
    온가족할인 30년이상 (50%}

    공시지원금 계산

    할부원금 계산
    24개월

    출고가
    836,000원 (월 34,833원)

    공시지원금
    -143,000원 (월 -5,958원)

    나나모바일 지원금
    -21,400원 (월 -892원)

    총 할부원금 671,600원 (월 27,983원)

    지기 셀렉트박스안에 옵션중 온가족할인 10년 같이 하나씩 선택하면 다 그 요금제에 따라 옆에 공시지원금과 나나모바일 가격이 변하는걸 만들고 싶은데 셀렉트가 전체 선택되어서 하나씩 다르게 안 들어가네요;;
    괜찮으시면 조언좀 메일로 받을 수있을까요

    Reply
    1. 박한샘 says:
      2016-06-16 at 15:33

      function kt1(){

      document.getElementById(“kkk”).innerHTML = ‘500000’;

      }

      미적용
      온가족할인 10년미만 (10%}
      온가족할인 20년미만 (20%}
      온가족할인 30년미만 (30%}
      온가족할인 30년이상 (50%}

      공시지원금 계산

      할부원금 계산
      24개월

      출고가
      836,000원 (월 34,833원)

      공시지원금
      -143,000원 (월 -5,958원)

      나나모바일 지원금
      -21,400원 (월 -892원)

      총 할부원금 671,600원 (월 27,983원)

      Reply
    2. 편리 says:
      2016-06-16 at 21:43

      안녕하세요. 남겨주신 내용은 봤습니다만
      저도 하는 일이 있고 개인 시간이 많지 않기 때문에 답변을 드리기가 어렵습니다.
      프로그램 관련 커뮤니티 등에 질문을 올려보시는 게 좋을 것 같습니다.

      Reply

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Recent Posts

  • php 배열 연산에서 + 와 array_merge 의 차이
  • pcntl_fork 를 이용한 다중 프로세스 실행
  • 아이폰 단축어를 이용하여 주중 공휴일엔 알람 울리지 않게 하기
  • 구글 캘린더 전체일정 재동기화
  • OpenLiteSpeed 웹서버에 HTTP 인증 적용
  • OpenLiteSpeed 웹어드민 도메인 연결
  • WireGuard를 이용한 VPN 환경 구축
  • Ubuntu 22.04 서버에 OpenLiteSpeed 웹서버 세팅
  • 맥 vim 세팅
  • 우분투 시스템 터미널쉘 zsh 로 변경

Recent Comments

  • 편리 on 업무관리용 그누보드 게시판 스킨
  • 임종섭 on 업무관리용 그누보드 게시판 스킨
  • 캐논 5D 펌웨어 | Dslr 펌웨어 업그레이드 방법 82 개의 베스트 답변 on 캐논 EOS 30D 펌웨어 Ver 1.0.6 , EOS 5D 펌웨어 Ver 1.1.1
  • Top 5 캐논 5D 펌웨어 Top 89 Best Answers on 캐논 EOS 30D 펌웨어 Ver 1.0.6 , EOS 5D 펌웨어 Ver 1.1.1
  • 편리 on 워드프레스 애니메이션 gif 파일을 mp4로 변환하여 출력하기
  • 임팀장 on 워드프레스 애니메이션 gif 파일을 mp4로 변환하여 출력하기
  • 편리 on Notepad++ NppFTP 플러그인 수동 설치
  • paul-j on Notepad++ NppFTP 플러그인 수동 설치
  • YS on Windows 10 iCloud 사진 저장 폴더 변경
  • 편리 on Docker를 이용한 Centos7 + httpd + php 5.4 개발환경 구축

Meta

  • Log in
  • Entries feed
  • Comments feed
  • WordPress.org
© 2025 CHICPRO | Built using WordPress and SuperbThemes