채택완료

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

2023-02-01 (수) 19:14:10 2,223

라디오버튼으로 제품가격 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개 / 댓글 3개

채택된 답변
+20 포인트

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

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

document.getElementById('f' + s).style.display='';
Copy
<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>

답변에 대한 댓글 1개

s == "값" 이었는데 s=="" 붙쳐쓰니까 작동이 안됐었네요... 시간내주셔서 감사합니다!
2023-02-01 (수) 19:41:50

document.getElementByid

->

Document.getElementById

답변에 대한 댓글 2개

본문처럼 if문 자체가 아예 작동을 하지 않습니다...ㅜㅜ
s == "값" 이었는데 s=="" 붙쳐쓰니까 작동이 안됐었네요... 시간내주셔서 감사합니다!

답변을 작성하려면 로그인이 필요합니다.