셀렉트박스 스크립트 질문드립니다.

셀렉트박스 스크립트 질문드립니다.

QA

셀렉트박스 스크립트 질문드립니다.

본문

아래의 셀렉트박스에서 선택된 값과 id값이 같은 div만 display block이 되도록 하고싶은데요...
지금은 선택되는 셀렉트가 모두 display block으로 바뀐채로 유지됩니다.

선택 외 나머지 id는 display none으로 바뀌도록 할 수 있을까요?

div의 기본값은 ddisplay none으로 했습니다.


<form name="form1">
<select name="bxCheck" onChange=view()>
   <option value="">선택</option>
   <option value="t_01">1</option>
   <option value="t_02">2</option>
   <option value="t_03">3</option>
</select>
</form>
<script>
function view(target) {
var sel = form1.bxCheck.value;
document.getElementById(sel).style.display='block';
}
</script>
<style>
#t_01, #t_02, #t_03 {display:none;}
</style>
 
<div id="t_01">1</div>
<div id="t_02">2</div>
<div id="t_03">3</div>
 

이 질문에 댓글 쓰기 :

답변 2

function view(sel) {   
    for (var i=1; i <4; i++)
        document.getElementById('t_0'+i).style.display=form1.bxCheck.value == 't_0'+i ? 'block' : 'none'; 
}


<script src="<?php echo G5_JS_URL ?>/jquery-1.8.3.min.js"></script>
<script>
$('select[name="bxCheck"]').change(function(){
  var sel = $(this).val();
  $('div').css('display','none');
  $('div#'+sel).css('display','block');
});
</script>

스크립트를 해당코드로 바꿔보세요

답변을 작성하시기 전에 로그인 해주세요.
전체 117
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT