라디오 버튼으로 DIV 제어하려고 합니다.

라디오 버튼으로 DIV 제어하려고 합니다.

QA

라디오 버튼으로 DIV 제어하려고 합니다.

본문

라디오버튼으로 제품가격 DIV를 제어하고싶은데 3일째 구글링과 잔머리로 조합을해도 계속 막혀서 질문하게 되었습니다.

 

-스크립트 내용-

function checking(s) {

    alert(s)

if(s == '1GB'){

    document.getElementByid('f' + s).style.display='';

}else if(s == "2GB"){

    document.getElementByid('f' + s).style.display='';

}else if(s=="3GB"){

    document.getElementByid('f' + s).style.display='';

}else if(s=="4GB"){

    document.getElementByid('f' + s).style.display='';

}else if(s=="5GB"){

    document.getElementByid('f' + s).style.display='';

}

}

 

- 라디오 내용 -

<input id='$val' type='radio' name='od_1' value='$val' onclick='checking(this.value)' data-tab='$val'>

 

-DIV 내용-

                        <div id="f1GB" style="display: none;"><?php echo $pricelist[0] ?></div>

                        <div id="f2GB" style="display: none;"><?php echo $pricelist[1] ?></div>

                        <div id="f3GB" style="display: none;"><?php echo $pricelist[2] ?></div>

                        <div id="f4GB" style="display: none;"><?php echo $pricelist[3] ?></div>

                        <div id="f5GB" style="display: none;"><?php echo $pricelist[4] ?></div>

 

이렇게 작성하였는데 alert(s)에는 벨류값 1GB를 선택하면 1GB가 정상적으로 출력되는데

IF문은 아예 작동이 안되는데 제가 잘못입력한건가요??

이 질문에 댓글 쓰기 :

답변 2

Byid 가 아닌 ById 가 되어야 합니다.


// document.getElementByid('f' + s).style.display='';
document.getElementById('f' + s).style.display='';

 


<script>
function checking(s) {
    alert(s)
if(s == '1GB'){
    document.getElementById('f' + s).style.display='';
}else if(s == "2GB"){
    document.getElementById('f' + s).style.display='';
}else if(s=="3GB"){
    document.getElementById('f' + s).style.display='';
}else if(s=="4GB"){
    document.getElementById('f' + s).style.display='';
}else if(s=="5GB"){
    document.getElementById('f' + s).style.display='';
}
}
</script>
 
<label><input id='$val' type='radio' name='od_1' value='1GB' onclick='checking(this.value)' data-tab='$val'> 1GB</label>
<label><input id='$val' type='radio' name='od_1' value='2GB' onclick='checking(this.value)' data-tab='$val'> 2GB</label>
<label><input id='$val' type='radio' name='od_1' value='3GB' onclick='checking(this.value)' data-tab='$val'> 3GB</label>
<label><input id='$val' type='radio' name='od_1' value='4GB' onclick='checking(this.value)' data-tab='$val'> 4GB</label>
<label><input id='$val' type='radio' name='od_1' value='5GB' onclick='checking(this.value)' data-tab='$val'> 5GB</label>
 
<div id="f1GB" style="display: none;">10,000</div>
<div id="f2GB" style="display: none;">20,000</div>
<div id="f3GB" style="display: none;">30,000</div>
<div id="f4GB" style="display: none;">40,000</div>
<div id="f5GB" style="display: none;">50,000</div>

document.getElementByid

->

Document.getElementById

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

회원로그인

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