체크박스 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>
|
댓글을 작성하시려면 로그인이 필요합니다.
댓글 1개
혹시 필요하실 분이 있으실지 몰라 올립니다.
---------------------------------------------------------------------------------
<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>