체크박스 3개이상 선택시 해당 박스 보이기 질문드립니다. 정보
체크박스 3개이상 선택시 해당 박스 보이기 질문드립니다.본문
아래에서 체크박스 3개이상 선택되면 아래 박스보이기 질문 드립니다.
여기저기 검색을 해봐도 선택시 결과는 있는데 체크된 수량에 따라 나오는 결과에 대한것은 찾기가 어렵네요.
<p><input type="checkbox" name="a1">1항목 <input type="checkbox" name="a2">2항목 <input type="checkbox" name="a3">3항목 <input type="checkbox" name="a4">4항목 <input type="checkbox" name="a5">5항목</p>
<p> </p>
<table border="1" width="329" height="70">
<tr>
<td width="319">3개이하는 이박스</td>
</tr>
</table>
<table border="1" width="329" height="70">
<tr>
<td width="319">3개이상은 이박스</td>
</tr>
</table>
여기저기 검색을 해봐도 선택시 결과는 있는데 체크된 수량에 따라 나오는 결과에 대한것은 찾기가 어렵네요.
<p><input type="checkbox" name="a1">1항목 <input type="checkbox" name="a2">2항목 <input type="checkbox" name="a3">3항목 <input type="checkbox" name="a4">4항목 <input type="checkbox" name="a5">5항목</p>
<p> </p>
<table border="1" width="329" height="70">
<tr>
<td width="319">3개이하는 이박스</td>
</tr>
</table>
<table border="1" width="329" height="70">
<tr>
<td width="319">3개이상은 이박스</td>
</tr>
</table>
댓글 전체
다른곳에서 답을 얻었습니다.
혹시 필요하실 분이 있으실지 몰라 올립니다.
---------------------------------------------------------------------------------
<script type='text/javascript'>
function Chk(cname) {
var cnt=0;
for( var iStep=0; iStep < document.forms(0).elements.length; iStep++){
var elem = form1.elements[iStep];
if(elem.checked == true) cnt++;
}
if(cnt >= 3) {
document.getElementById('box1').style.display = "none";
document.getElementById('box2').style.display = "block";
} else {
document.getElementById('box2').style.display = "none";
document.getElementById('box1').style.display = "block";
}
}
</script>
<form name='form1'>
<p>
<input type="checkbox" name="a" onClick="Chk('a');">1항목
<input type="checkbox" name="a" onClick="Chk('a');">2항목
<input type="checkbox" name="a" onClick="Chk('a');">3항목
<input type="checkbox" name="a" onClick="Chk('a');">4항목
<input type="checkbox" name="a" onClick="Chk('a');">5항목
</p>
<p> </p>
<div id='box1' style="display:none;">
<table border="1" width="329" height="70">
<tr>
<td width="319">3개이하는 이박스</td>
</tr>
</table>
</div>
<div id='box2' style="display:none;">
<table border="1" width="329" height="70">
<tr>
<td width="319">3개이상은 이박스</td>
</tr>
</table>
</div>
</form>
혹시 필요하실 분이 있으실지 몰라 올립니다.
---------------------------------------------------------------------------------
<script type='text/javascript'>
function Chk(cname) {
var cnt=0;
for( var iStep=0; iStep < document.forms(0).elements.length; iStep++){
var elem = form1.elements[iStep];
if(elem.checked == true) cnt++;
}
if(cnt >= 3) {
document.getElementById('box1').style.display = "none";
document.getElementById('box2').style.display = "block";
} else {
document.getElementById('box2').style.display = "none";
document.getElementById('box1').style.display = "block";
}
}
</script>
<form name='form1'>
<p>
<input type="checkbox" name="a" onClick="Chk('a');">1항목
<input type="checkbox" name="a" onClick="Chk('a');">2항목
<input type="checkbox" name="a" onClick="Chk('a');">3항목
<input type="checkbox" name="a" onClick="Chk('a');">4항목
<input type="checkbox" name="a" onClick="Chk('a');">5항목
</p>
<p> </p>
<div id='box1' style="display:none;">
<table border="1" width="329" height="70">
<tr>
<td width="319">3개이하는 이박스</td>
</tr>
</table>
</div>
<div id='box2' style="display:none;">
<table border="1" width="329" height="70">
<tr>
<td width="319">3개이상은 이박스</td>
</tr>
</table>
</div>
</form>
