셀렉트 박스에서 기타항목 선택시 숨어있던 텍스트 필드가 나타가도록 하는 방법을 알고 싶습니다.
본문
현재 회원가입 시 여분필드를 사용하여 자신의 직업을 위 이미지에 나온 것 처럼 셀렉트 박스 형태로 추가정보를 입력받을 수 있게 구현하려고 하는데요.
만약 회원가입자가 기타항목을 선택하게 된다면 이에 대한 내용을 따로 받아야 하는 상황이어서요.
그래서 혹시 기타항목을 선택한다면 숨어있던 텍스트 필드가 나타나서 기타에 관련된 내용을 입력할 수 있게끔 하는 방법이 있을까요?
고수님들의 도움 부탁드립니다^^!!!
답변 2
-- jQuery 사용 --
<select id="job" name="job">
<option value="">선택</option>
<option value="1">없음</option>
<option value="2">학생</option>
<option value="3">피트니스강사</option>
<option value="4">퍼스널 크레이너</option>
<option value="5">아동, 노인 체육지도자</option>
<option value="6">스포츠 체력코치</option>
<option value="etc">기타</option>
</select>
//상단의 select box에서 '기타'를 선택하면 나타날 인풋박스
<input type="text" id="jobDirect" name="jobDirect"/>
<script>
$(function(){
//입력박스 숨어있다가
$("#jobDirect").hide();
$("#job").change(function() {
//기타를 선택하면 등장
if($("#job").val() == "etc") {
$("#jobDirect").show();
} else {
$("#jobDirect").hide();
}
})
});
</script>
감사합니다 해결되었습니다~!!
style="display:none" 으로 텍스트 박스 안보이게 설정했다가 기타 항목 선택시 이벤트 style="display:block" 으로 텍스트 박스 보이게 작성해보세요.
네, 말씀하신 내용이 감은 오는데, 제가 실력이 뒷받침을 못해서 그런지 실제 어떻게 이벤트를 줘야할지 잘 모르겠네요 ㅠㅠ;;
답변을 작성하시기 전에 로그인 해주세요.
