순차적 체크박스 질문 채택완료
블랑숑
8년 전
조회 3,880
</p><p><aside id="side_search" class="at-sidebar en<?php echo $sidebar_effect;?>">
<div class="close-box asideButton1" title="Hide sidebar" style="margin-top:100px;">
<i class="fa fa-search"></i>
</div>
<div class="sidebar-wrap">
<form name="frmdetailsearch" role="form" method="get" action="/shop/search.php" onsubmit="return fsearchbox_submit(this);">
<input type="hidden" name="qsort" id="qsort" value="<?php echo $qsort ?>">
<input type="hidden" name="qorder" id="qorder" value="<?php echo $qorder ?>">
<input type="hidden" name="qcaid" id="qcaid" value="<?php echo $qcaid ?>">
<div>
<div id="group1">
<label style="display:block;"><b>고객님꼐서 가장 중요하게 생각하시는 기능은?</b>
</label>
<input type="checkbox" id="step1_1" onclick="eventCheck(this,'group1')"> 스크린 프로젝터
<input type="checkbox" id="step1_2" onclick="eventCheck(this,'group1')"> 판서(글쓰기)
<input type="checkbox" id="step1_3" onclick="eventCheck(this,'group1')"> 지움성
<input type="checkbox" id="step1_4" onclick="eventCheck(this,'group1')"> 인테리어 효과
</div></p><p> <div id="group2_1" style="display:none;">
<label style="display:block;"><b>스크린 프로젝터</b>
</label>
<input type="checkbox" id="step2_1" name="it_1[]" value="1" onclick="eventCheck(this,'group2_1')" <?php echo in_array("1",$it_1)?'checked="checked"':'';?>> 무반사 화이트보드
<input type="checkbox" id="step2_2" name="it_1[]" value="2" onclick="eventCheck(this,'group2_1')" <?php echo in_array("2",$it_1)?'checked="checked"':'';?>> 무반사 화이트보드 시트지
<input type="checkbox" id="step2_3" name="it_1[]" value="3" onclick="eventCheck(this,'group2_1')" <?php echo in_array("3",$it_1)?'checked="checked"':'';?>> 스크린 유리보드
<input type="checkbox" id="step2_4" name="it_1[]" value="4" onclick="eventCheck(this,'group2_1')" <?php echo in_array("4",$it_1)?'checked="checked"':'';?>> 그랜드뷰 리마커블 스크린
</div></p><p> <div id="group2_2" style="display:none;">
<label style="display:block;"><b>판서(글쓰기)</b>
</label>
<input type="checkbox" id="step2_5" name="it_1[]" value="1" onclick="eventCheck(this,'group2_2')" <?php echo in_array("1",$it_1)?'checked="checked"':'';?>> 두배로 화이트보드
<input type="checkbox" id="step2_6" name="it_1[]" value="2" onclick="eventCheck(this,'group2_2')" <?php echo in_array("2",$it_1)?'checked="checked"':'';?>> 두배로 화이트보드 시트지
<input type="checkbox" id="step2_7" name="it_1[]" value="3" onclick="eventCheck(this,'group2_2')" <?php echo in_array("3",$it_1)?'checked="checked"':'';?>> 난반사 유리보드
<input type="checkbox" id="step2_8" name="it_1[]" value="4" onclick="eventCheck(this,'group2_2')" <?php echo in_array("4",$it_1)?'checked="checked"':'';?>> 유광 유리보드
<input type="checkbox" id="step2_9" name="it_1[]" value="3" onclick="eventCheck(this,'group2_2')" <?php echo in_array("3",$it_1)?'checked="checked"':'';?>> 법랑화이트보드
<input type="checkbox" id="step2_10" name="it_1[]" value="3" onclick="eventCheck(this,'group2_2')" <?php echo in_array("3",$it_1)?'checked="checked"':'';?>> 물칠판
<input type="checkbox" id="step2_11" name="it_1[]" value="3" onclick="eventCheck(this,'group2_2')" <?php echo in_array("3",$it_1)?'checked="checked"':'';?>> 청칠판
</div></p><p> <div id="group2_3" style="display:none;">
<label style="display:block;"><b>지움성</b>
</label>
<input type="checkbox" id="step2_5" name="it_1[]" value="1" onclick="eventCheck(this,'group2_3')" <?php echo in_array("1",$it_1)?'checked="checked"':'';?>> 두배로 화이트보드
<input type="checkbox" id="step2_6" name="it_1[]" value="2" onclick="eventCheck(this,'group2_3')" <?php echo in_array("2",$it_1)?'checked="checked"':'';?>> 두배로 화이트보드 시트지
<input type="checkbox" id="step2_7" name="it_1[]" value="3" onclick="eventCheck(this,'group2_3')" <?php echo in_array("3",$it_1)?'checked="checked"':'';?>> 난반사 유리보드
<input type="checkbox" id="step2_8" name="it_1[]" value="4" onclick="eventCheck(this,'group2_3')" <?php echo in_array("4",$it_1)?'checked="checked"':'';?>> 유광 유리보드
</div></p><p> <div id="group2_4" style="display:none;">
<label style="display:block;"><b>인테리어 효과</b>
</label>
<input type="checkbox" id="step2_1" name="it_1[]" value="1" onclick="eventCheck(this,'group2_4')" <?php echo in_array("1",$it_1)?'checked="checked"':'';?>> 무반사 화이트보드
<input type="checkbox" id="step2_2" name="it_1[]" value="2" onclick="eventCheck(this,'group2_4')" <?php echo in_array("2",$it_1)?'checked="checked"':'';?>> 무반사 화이트보드 시트지
<input type="checkbox" id="step2_7" name="it_1[]" value="3" onclick="eventCheck(this,'group2_4')" <?php echo in_array("3",$it_1)?'checked="checked"':'';?>> 난반사 유리보드
<input type="checkbox" id="step2_4" name="it_1[]" value="4" onclick="eventCheck(this,'group2_4')" <?php echo in_array("4",$it_1)?'checked="checked"':'';?>> 그랜드뷰 리마커블 스크린
</div></p><p> <div id="group3_1" style="display:none;"></p><p> <div>
<label style="display:block;"><b>선택 옵션</b>
</label>
<input type="checkbox" name="it_2" value="yes" <?php echo $it_2_check?'checked="checked"':'';?>> 자석 기능
<input type="checkbox" name="it_3" value="yes" <?php echo $it_3_check?'checked="checked"':'';?>> 이동식 스탠드
<input type="checkbox" name="it_4" value="yes" <?php echo $it_4_check?'checked="checked"':'';?>> 맞춤시공
</div></p><p>
<div>
<label style="display:block;"><b>프레임 스타일</b>
</label>
<input type="checkbox" name="it_5" value="" <?=$_GET['it_5']==''?' checked="checked"':''?>> 전체
<input type="checkbox" name="it_5[]" value="1" <?php echo in_array("1",$it_5)?'checked="checked"':'';?>> 알루미늄(은색)
<input type="checkbox" name="it_5[]" value="2" <?php echo in_array("2",$it_5)?'checked="checked"':'';?>> 오크목
<input type="checkbox" name="it_5[]" value="3" <?php echo in_array("3",$it_5)?'checked="checked"':'';?>> 월넛목
<input type="checkbox" name="it_5[]" value="4" <?php echo in_array("4",$it_5)?'checked="checked"':'';?>> 화이트목
<input type="checkbox" name="it_5[]" value="5" <?php echo in_array("5",$it_5)?'checked="checked"':'';?>> 블랙목
</div></p><p>
<div class="nop">
<label><b>가로 선택 (cm)</b></label>
<div>
<label>
<input type="text" name="wfrom" value="<?php echo $wfrom; ?>" id="ssch_wfrom" size="10" placeholder="최소 가로">
</label>
<label> ~</label>
<label>
<input type="text" name="wto" value="<?php echo $wto; ?>" id="ssch_wto" size="10" placeholder="최대 가로">
</label>
</div>
</div></p><p> <div class="nop">
<label><b>세로 선택 (cm)</b></label>
<div>
<label>
<input type="text" name="hfrom" value="<?php echo $hfrom; ?>" id="ssch_hfrom" size="10" placeholder="최소 세로">
</label>
<label> ~</label>
<label>
<input type="text" name="hto" value="<?php echo $hto; ?>" id="ssch_hto" size="10" placeholder="최대 세로">
</label>
</div>
</div></p><p> <div class="nop">
<label><b>상품가격 (원)</b></label>
<div>
<label>
<input type="text" name="qfrom" value="<?php echo $qfrom; ?>" id="ssch_qfrom" size="10" placeholder="최소 가격">
</label>
<label> ~</label>
<label>
<input type="text" name="qto" value="<?php echo $qto; ?>" id="ssch_qto" size="10" placeholder="최대 가격">
</label>
</div>
</div></p><p> <div class="si">
<div>
<button type="submit">검색하기</button>
</div>
</div></p><p> </div></p><p> <div id="group3_2" style="display:none;"></p><p> <div>
<label style="display:block;"><b>선택 옵션</b>
</label>
<input type="checkbox" name="it_4" value="yes" <?php echo $it_4_check?'checked="checked"':'';?>> 맞춤시공
</div></p><p>
<div class="nop">
<label><b>가로 선택 (cm)</b></label>
<div>
<label>
<input type="text" name="wfrom" value="<?php echo $wfrom; ?>" id="ssch_wfrom" size="10" placeholder="최소 가로">
</label>
<label> ~</label>
<label>
<input type="text" name="wto" value="<?php echo $wto; ?>" id="ssch_wto" size="10" placeholder="최대 가로">
</label>
</div>
</div></p><p> <div class="nop">
<label><b>세로 선택 (cm)</b></label>
<div>
<label>
<input type="text" name="hfrom" value="<?php echo $hfrom; ?>" id="ssch_hfrom" size="10" placeholder="최소 세로">
</label>
<label> ~</label>
<label>
<input type="text" name="hto" value="<?php echo $hto; ?>" id="ssch_hto" size="10" placeholder="최대 세로">
</label>
</div>
</div></p><p> <div class="nop">
<label><b>상품가격 (원)</b></label>
<div>
<label>
<input type="text" name="qfrom" value="<?php echo $qfrom; ?>" id="ssch_qfrom" size="10" placeholder="최소 가격">
</label>
<label> ~</label>
<label>
<input type="text" name="qto" value="<?php echo $qto; ?>" id="ssch_qto" size="10" placeholder="최대 가격">
</label>
</div>
</div></p><p> <div class="si">
<div>
<button type="submit">검색하기</button>
</div>
</div></p><p> </div></p><p> <div id="group3_3" style="display:none;"></p><p> <div>
<label style="display:block;"><b>선택 옵션</b>
</label>
<input type="checkbox" name="it_4" value="yes" <?php echo $it_4_check?'checked="checked"':'';?>> 맞춤시공
</div></p><p> <div class="si">
<div>
<button type="submit">검색하기</button>
</div>
</div></p><p> </div></p><p> </div>
</form>
</div></p><p> <script>
function set_sort(qsort) {
var f = document.frmdetailsearch;
var qorder = "desc";</p><p> if(qsort == "it_price_min") {
qsort = "it_price";
qorder = "asc";
}
f.qsort.value = qsort;
f.qorder.value = qorder;
f.submit();
}</p><p>
function set_ca_id(qcaid) {
var f = document.frmdetailsearch;
f.qcaid.value = qcaid;
f.submit();
}
</script></p><p> <script language="javascript"></p><p> function eventCheck(obj, group) {</p><p> var group2_1 = document.getElementById("group2_1");
group2_1.style.display = document.frmdetailsearch.step1_1.checked == false?"none":"block";</p><p> var group2_2 = document.getElementById("group2_2");
group2_2.style.display = document.frmdetailsearch.step1_2.checked == false?"none":"block";</p><p> var group2_3 = document.getElementById("group2_3");
group2_3.style.display = document.frmdetailsearch.step1_3.checked == false?"none":"block";</p><p> var group2_4 = document.getElementById("group2_4");
group2_4.style.display = document.frmdetailsearch.step1_4.checked == false?"none":"block";</p><p>
var group3_1 = document.getElementById("group3_1");
group3_1.style.display = document.frmdetailsearch.step2_1.checked == false?"none":"block";</p><p> var group3_1 = document.getElementById("group3_1");
group3_1.style.display = document.frmdetailsearch.step2_3.checked == false?"none":"block";</p><p> var group3_1 = document.getElementById("group3_1");
group3_1.style.display = document.frmdetailsearch.step2_5.checked == false?"none":"block";</p><p> var group3_1 = document.getElementById("group3_1");
group3_1.style.display = document.frmdetailsearch.step2_7.checked == false?"none":"block";</p><p> var group3_1 = document.getElementById("group3_1");
group3_1.style.display = document.frmdetailsearch.step2_8.checked == false?"none":"block";</p><p> var group3_1 = document.getElementById("group3_1");
group3_1.style.display = document.frmdetailsearch.step2_9.checked == false?"none":"block";</p><p> var group3_1 = document.getElementById("group3_1");
group3_1.style.display = document.frmdetailsearch.step2_10.checked == false?"none":"block";</p><p> var group3_1 = document.getElementById("group3_1");
group3_1.style.display = document.frmdetailsearch.step2_11.checked == false?"none":"block";</p><p> </p><p>
var group3_2 = document.getElementById("group3_2");
group3_2.style.display = document.frmdetailsearch.step2_2.checked == false?"none":"block";</p><p> var group3_2 = document.getElementById("group3_2");
group3_2.style.display = document.frmdetailsearch.step2_6.checked == false?"none":"block";</p><p> var group3_3 = document.getElementById("group3_3");
group3_3.style.display = document.frmdetailsearch.step2_4.checked == false?"none":"block";</p><p> </p><p> var oBool = obj.checked; //선택한 체크박스 checked 값을 변수에 담는다.
var oDiv = document.getElementById(group); //해당 그룹 div
var oNodeList = oDiv.getElementsByTagName("INPUT"); //div 안에 속해 있는 개체</p><p> /* 해당 그룹에 있는 체크박스 모두 해제 */
for (i = 0; i < oNodeList.length; i++)
{
if (oNodeList[i].type == "checkbox")
{
oNodeList[i].checked = false;
}
}
/* 선택한 체크박스에 checked 적용 */
obj.checked = oBool;</p><p> }
</script></p><p></aside></p><p>
위와 같은 소스를 짜집기 해서 만들었는데요 step1을 체크하면 step2만 나와야 하는데 3까지 다나오네요 ㅠㅠ 심지어 3가 2개 나와요
그리고 step1 중 하나를 클릭한 상태에서 다른 step1을 클릭하면 기존 내용이 없어져야 하는데 안없어집니다 ㅠㅠ
도와주세요 형님들 ㅠㅠ
댓글을 작성하려면 로그인이 필요합니다.
답변 3개
채택된 답변
+20 포인트
8년 전
기존에 호출하고 있는 eventCheck 함수를 없애버리시고, 그 밑에다가 아래의 스크립트 소스를 넣어보세요. 잘되실겁니다.
</p><p>$(function(){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$("div#group1").find("input[type='checkbox']").click(function(){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>idx = $("div#group1").find("input[type='checkbox']").index(this);</p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$("div#group1").find("input[type='checkbox']").each(function(i){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>if(idx == i && $(this).is(":checked")){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$("#group2_" + parseInt(i+1)).show();</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}else{</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$(this).attr("checked", false);</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$("#group2_" + parseInt(i+1)).hide();</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>})</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>});</p><p>});</p><p>
로그인 후 평가할 수 있습니다
답변에 대한 댓글 2개
�
블랑숑
8년 전
�
블랑숑
8년 전
그룹 2_1,2_2,2_3과 관계없이 step2_4는 group3_3, step2_2와 2_6은 group3_2, 나머지는 group3_1이 나와야 해요 ㅠㅠ
댓글을 작성하려면 로그인이 필요합니다.
8년 전
html 소스와 script 소스 구문을 바꿔야 합니다.
html 소스구문은 검색 serch <form>~~~</form> 폼태그 안에거를 아래의 소스로 통째로 바꾸세요.
그리고 스크립트 구문도 통째로 바꾸세요.
바꾸기전 백업은 하시고 바꾸시면 될듯...
html 구문
</p><p><form name="frmdetailsearch" role="form" method="get" action="<a href="<a href="http://spacewhiteboard.com/shop/search.php" target="_blank" rel="noopener noreferrer">http://spacewhiteboard.com/shop/search.php</a>"><a href="http://spacewhiteboard.com/shop/search.php" target="_blank" rel="noopener noreferrer">http://spacewhiteboard.com/shop/search.php</a></a>" onsubmit="return fsearchbox_submit(this);"></p><p><input type="hidden" name="qsort" id="qsort" value=""></p><p><input type="hidden" name="qorder" id="qorder" value=""></p><p><input type="hidden" name="qcaid" id="qcaid" value=""></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div id="group1"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label style="display:block;"><b>고객님꼐서 가장 중요하게 생각하시는 기능은?</b>
</label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" id="step1_1" onclick="eventCheck(this,'group1')"> 스크린 프로젝터
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" id="step1_2" onclick="eventCheck(this,'group1')"> 판서(글쓰기)
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" id="step1_3" onclick="eventCheck(this,'group1')"> 지움성
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" id="step1_4" onclick="eventCheck(this,'group1')"> 인테리어 효과</p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div id="group2_1" style="display:none;"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label style="display:block;"><b>스크린 프로젝터</b>
</label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" class="step2_1" name="it_1[]" value="1" onclick="eventCheck(this,'group2_1')" > 무반사 화이트보드
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" class="step2_2" name="it_1[]" value="2" onclick="eventCheck(this,'group2_1')" > 무반사 화이트보드 시트지
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" class="step2_3" name="it_1[]" value="3" onclick="eventCheck(this,'group2_1')" > 스크린 유리보드
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" class="step2_4" name="it_1[]" value="4" onclick="eventCheck(this,'group2_1')" > 그랜드뷰 리마커블 스크린</p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div id="group2_2" style="display:none;"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label style="display:block;"><b>판서(글쓰기)</b>
</label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" class="step2_5" name="it_1[]" value="1" onclick="eventCheck(this,'group2_2')" > 두배로 화이트보드
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" class="step2_6" name="it_1[]" value="2" onclick="eventCheck(this,'group2_2')" > 두배로 화이트보드 시트지
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" class="step2_7" name="it_1[]" value="3" onclick="eventCheck(this,'group2_2')" > 난반사 유리보드
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" class="step2_8" name="it_1[]" value="4" onclick="eventCheck(this,'group2_2')" > 유광 유리보드
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" class="step2_9" name="it_1[]" value="3" onclick="eventCheck(this,'group2_2')" > 법랑화이트보드
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" class="step2_10" name="it_1[]" value="3" onclick="eventCheck(this,'group2_2')" > 물칠판
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" class="step2_11" name="it_1[]" value="3" onclick="eventCheck(this,'group2_2')" > 청칠판</p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div id="group2_3" style="display:none;"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label style="display:block;"><b>지움성</b>
</label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" class="step2_5" name="it_1[]" value="1" onclick="eventCheck(this,'group2_3')" > 두배로 화이트보드
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" class="step2_6" name="it_1[]" value="2" onclick="eventCheck(this,'group2_3')" > 두배로 화이트보드 시트지
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" class="step2_7" name="it_1[]" value="3" onclick="eventCheck(this,'group2_3')" > 난반사 유리보드
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" class="step2_8" name="it_1[]" value="4" onclick="eventCheck(this,'group2_3')" > 유광 유리보드</p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div id="group2_4" style="display:none;"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label style="display:block;"><b>인테리어 효과</b>
</label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" class="step2_1" name="it_1[]" value="1" onclick="eventCheck(this,'group2_4')" > 무반사 화이트보드
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" class="step2_2" name="it_1[]" value="2" onclick="eventCheck(this,'group2_4')" > 무반사 화이트보드 시트지
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" class="step2_7" name="it_1[]" value="3" onclick="eventCheck(this,'group2_4')" > 난반사 유리보드
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" class="step2_4" name="it_1[]" value="4" onclick="eventCheck(this,'group2_4')" > 그랜드뷰 리마커블 스크린</p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div id="group3_1" style="display:none;"></p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label style="display:block;"><b>선택 옵션</b>
</label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" name="it_2" value="yes" > 자석 기능
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" name="it_3" value="yes" > 이동식 스탠드
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" name="it_4" value="yes" > 맞춤시공</p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p> </p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label style="display:block;"><b>프레임 스타일</b>
</label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" name="it_5" value="" checked="checked"> 전체
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" name="it_5[]" value="1" > 알루미늄(은색)
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" name="it_5[]" value="2" > 오크목
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" name="it_5[]" value="3" > 월넛목
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" name="it_5[]" value="4" > 화이트목
</p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" name="it_5[]" value="5" > 블랙목</p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p> </p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div class="nop"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label><b>가로 선택 (cm)</b></label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="text" name="wfrom" value="" id="ssch_wfrom" size="10" placeholder="최소 가로"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label> ~</label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="text" name="wto" value="" id="ssch_wto" size="10" placeholder="최대 가로"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div class="nop"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label><b>세로 선택 (cm)</b></label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="text" name="hfrom" value="" id="ssch_hfrom" size="10" placeholder="최소 세로"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label> ~</label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="text" name="hto" value="" id="ssch_hto" size="10" placeholder="최대 세로"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div class="nop"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label><b>상품가격 (원)</b></label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="text" name="qfrom" value="" id="ssch_qfrom" size="10" placeholder="최소 가격"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label> ~</label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="text" name="qto" value="" id="ssch_qto" size="10" placeholder="최대 가격"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div class="si"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><button type="submit">검색하기</button></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div id="group3_2" style="display:none;"></p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label style="display:block;"><b>선택 옵션</b>
</label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" name="it_4" value="yes" > 맞춤시공</p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p> </p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div class="nop"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label><b>가로 선택 (cm)</b></label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="text" name="wfrom" value="" id="ssch_wfrom" size="10" placeholder="최소 가로"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label> ~</label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="text" name="wto" value="" id="ssch_wto" size="10" placeholder="최대 가로"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div class="nop"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label><b>세로 선택 (cm)</b></label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="text" name="hfrom" value="" id="ssch_hfrom" size="10" placeholder="최소 세로"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label> ~</label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="text" name="hto" value="" id="ssch_hto" size="10" placeholder="최대 세로"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div class="nop"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label><b>상품가격 (원)</b></label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="text" name="qfrom" value="" id="ssch_qfrom" size="10" placeholder="최소 가격"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label> ~</label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="text" name="qto" value="" id="ssch_qto" size="10" placeholder="최대 가격"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div class="si"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><button type="submit">검색하기</button></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div id="group3_3" style="display:none;"></p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label style="display:block;"><b>선택 옵션</b>
</label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" name="it_4" value="yes" > 맞춤시공</p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div class="si"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><button type="submit">검색하기</button></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p> </p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p></form></p><div>
</div><p>
script 구문
</p><p><script language="javascript"></p><p>$(function(){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$("div#group1").find("input[type='checkbox']").click(function(){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>idx = $("div#group1").find("input[type='checkbox']").index(this);</p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$("div#group1").find("input[type='checkbox']").each(function(i){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>if(idx == i && $(this).is(":checked")){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$("#group2_" + parseInt(i+1)).show();</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}else{</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$(this).attr("checked", false);</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$("#group2_" + parseInt(i+1)).hide().find("input[type='checkbox']").attr("checked", false);</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>});</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>hideReset();</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>});</p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$("div#group2_1").find("input[type='checkbox']").click(function(){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>hideReset();</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>if(!$(this).is(":checked")){ return false; }</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>idx = $("div#group2_1").find("input[type='checkbox']").index(this);</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$("div#group2_1").find("input[type='checkbox']").each(function(i){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>if(idx == i && $(this).is(":checked")){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>setCheck($(this).attr("class"));</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}else{</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$(this).attr("checked", false);</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>})</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>});</p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$("div#group2_2").find("input[type='checkbox']").click(function(){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>hideReset();</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>idx = $("div#group2_2").find("input[type='checkbox']").index(this);</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$("div#group2_2").find("input[type='checkbox']").each(function(i){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>if(idx == i && $(this).is(":checked")){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>setCheck($(this).attr("class"));</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}else{</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$(this).attr("checked", false);</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>})</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>});</p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$("div#group2_3").find("input[type='checkbox']").click(function(){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>hideReset();</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>if(!$(this).is(":checked")){ return false; }</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>idx = $("div#group2_3").find("input[type='checkbox']").index(this);</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$("div#group2_3").find("input[type='checkbox']").each(function(i){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>if(idx == i && $(this).is(":checked")){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>setCheck($(this).attr("class"));</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}else{</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$(this).attr("checked", false);</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>})</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>});</p><p> </p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$("div#group2_4").find("input[type='checkbox']").click(function(){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>hideReset();</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>if(!$(this).is(":checked")){ return false; }</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>idx = $("div#group2_4").find("input[type='checkbox']").index(this);</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$("div#group2_4").find("input[type='checkbox']").each(function(i){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>if(idx == i && $(this).is(":checked")){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>setCheck($(this).attr("class"));</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}else{</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$(this).attr("checked", false);</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>})</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>});</p><p> </p><p>});</p><p> </p><p>function setCheck(_class){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>//step2_4는 group3_3, step2_2와 2_6은 group3_2, 나머지는 group3_1</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>// 3뎁스 group 모두 hide</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>hideReset();</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>if(_class == "step2_4"){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$("#group3_3").show();</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}else if(_class == "step2_2" || _class == "step2_6"){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$("#group3_2").show();</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}else{</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$("#group3_1").show();</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}</p><p>}</p><p> </p><p>function hideReset(){</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>$("#group3_1, #group3_2, #group3_3").hide().find("input[type='checkbox']").attr("checked", false);</p><p>}</p><p></script></p><p>
로그인 후 평가할 수 있습니다
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
group2도 1처럼 하나만 클릭되야 하는데 ㅠㅠ