[HTML] Select Option 시/구 선택 | optgroup 활용

 

 

HTML | 시/구 코드정리

 <select id="area" name="wr_5" id="wr_5" required>
                <optgroup label="서울특별시">
                  <option value="서울특별시 강남구">강남구</option>
                  <option value="서울특별시 강동구">강동구</option>
                  <option value="서울특별시 강북구">강북구</option>
                  <option value="서울특별시 강서구">강서구</option>
                  <option value="서울특별시 관악구">관악구</option>
                  <option value="서울특별시 광진구">광진구</option>
                  <option value="서울특별시 구로구">구로구</option>
                  <option value="서울특별시 금천구">금천구</option>
                  <option value="서울특별시 노원구">노원구</option>
                  <option value="서울특별시 도봉구">도봉구</option>
                  <option value="서울특별시 동대문구">동대문구</option>
                  <option value="서울특별시 동작구">동작구</option>
                  <option value="서울특별시 마포구">마포구</option>
                  <option value="서울특별시 서대문구">서대문구</option>
                  <option value="서울특별시 서초구">서초구</option>
                  <option value="서울특별시 성동구">성동구</option>
                  <option value="서울특별시 성북구">성북구</option>
                  <option value="서울특별시 송파구">송파구</option>
                  <option value="서울특별시 양천구">양천구</option>
                  <option value="서울특별시 영등포구">영등포구</option>
                  <option value="서울특별시 용산구">용산구</option>
                  <option value="서울특별시 은평구">은평구</option>
                  <option value="서울특별시 종로구">종로구</option>
                  <option value="서울특별시 중구">중구</option>
                  <option value="서울특별시 중랑구">중랑구</option>
                </optgroup>

                <!-- 부산광역시 -->
                <optgroup label="부산광역시">
                  <option value="부산광역시 강서구">강서구</option>
                  <option value="부산광역시 금정구">금정구</option>
                  <option value="부산광역시 남구">남구</option>
                  <option value="부산광역시 동구">동구</option>
                  <option value="부산광역시 동래구">동래구</option>
                  <option value="부산광역시 부산진구">부산진구</option>
                  <option value="부산광역시 북구">북구</option>
                  <option value="부산광역시 사상구">사상구</option>
                  <option value="부산광역시 사하구">사하구</option>
                  <option value="부산광역시 서구">서구</option>
                  <option value="부산광역시 수영구">수영구</option>
                  <option value="부산광역시 연제구">연제구</option>
                  <option value="부산광역시 영도구">영도구</option>
                  <option value="부산광역시 중구">중구</option>
                  <option value="부산광역시 해운대구">해운대구</option>
                </optgroup>

                <!-- 대구광역시 -->
                <optgroup label="대구광역시">
                  <option value="대구광역시 남구">남구</option>
                  <option value="대구광역시 달서구">달서구</option>
                  <option value="대구광역시 동구">동구</option>
                  <option value="대구광역시 북구">북구</option>
                  <option value="대구광역시 서구">서구</option>
                  <option value="대구광역시 수성구">수성구</option>
                  <option value="대구광역시 중구">중구</option>
                </optgroup>

                <!-- 인천광역시 -->
                <optgroup label="인천광역시">
                  <option value="인천광역시 강화군">강화군</option>
                  <option value="인천광역시 계양구">계양구</option>
                  <option value="인천광역시 남동구">남동구</option>
                  <option value="인천광역시 동구">동구</option>
                  <option value="인천광역시 미추홀구">미추홀구</option>
                  <option value="인천광역시 부평구">부평구</option>
                  <option value="인천광역시 서구">서구</option>
                  <option value="인천광역시 연수구">연수구</option>
                  <option value="인천광역시 중구">중구</option>
                </optgroup>

                <!-- 경기도 -->
                <optgroup label="경기도">
                  <option value="경기도 고양시">고양시</option>
                  <option value="경기도 과천시">과천시</option>
                  <option value="경기도 광명시">광명시</option>
                  <option value="경기도 광주시">광주시</option>
                  <option value="경기도 구리시">구리시</option>
                  <option value="경기도 군포시">군포시</option>
                  <option value="경기도 김포시">김포시</option>
                  <option value="경기도 남양주시">남양주시</option>
                  <option value="경기도 동두천시">동두천시</option>
                  <option value="경기도 부천시">부천시</option>
                  <option value="경기도 성남시">성남시</option>
                  <option value="경기도 수원시">수원시</option>
                  <option value="경기도 시흥시">시흥시</option>
                  <option value="경기도 안산시">안산시</option>
                  <option value="경기도 안성시">안성시</option>
                  <option value="경기도 안양시">안양시</option>
                  <option value="경기도 양주시">양주시</option>
                  <option value="경기도 여주시">여주시</option>
                  <option value="경기도 오산시">오산시</option>
                  <option value="경기도 용인시">용인시</option>
                  <option value="경기도 의왕시">의왕시</option>
                  <option value="경기도 의정부시">의정부시</option>
                  <option value="경기도 이천시">이천시</option>
                  <option value="경기도 파주시">파주시</option>
                  <option value="경기도 평택시">평택시</option>
                  <option value="경기도 포천시">포천시</option>
                  <option value="경기도 하남시">하남시</option>
                  <option value="경기도 화성시">화성시</option>
                </optgroup>
</select>