본문 바로가기

JavaScript/jQuery

jQuery Select Box 전체선택, 해제

<html>
<head>
<title></title>

<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script language=JavaScript>
//전체 선택/해제
 function selectAll(){
 var c = $('#checkAll').attr('checked');
 $('input[name=chkid]').attr('checked',c);
 }
 //선택된 값 보기
 function getSelectVal(){
 var idlist = [];
 var itemstr ="";
 $('input[name=chkid]:checked').each(function(){idlist.push(this.value)});
 
 $.each(idlist,function(index, item){
  itemstr += item + ',';
 });

 $('#resultID').text(itemstr);
 }
</script>

</head>
<body>

 <input type="checkbox" id="checkAll" class="chk" onclick="selectAll()" /> 전체선택<P/>

 

 <input type="checkbox" name="chkid"  value="1" class="chk" />1<P/>
 <input type="checkbox" name="chkid"  value="2" class="chk" />2<P/>
 <input type="checkbox" name="chkid"  value="3" class="chk" />3<P/>
 <input type="checkbox" name="chkid"  value="4" class="chk" />4<P/>
 <input type="checkbox" name="chkid"  value="5" class="chk" />5<P/>
 <input type="checkbox" name="chkid"  value="6" class="chk" />6<P/>
 <input type="checkbox" name="chkid"  value="7" class="chk" />7<P/>

 

 <input type="button" id="showval" onclick="getSelectVal()" value="선택값 보기" />

 

  당신이 선택하신 값은<span id="resultID"></span> 입니다.


</body>
</html>

'JavaScript > jQuery' 카테고리의 다른 글

jQuery 속성 선택자.  (0) 2015.12.28
jQuery 필터 선택자.  (0) 2015.12.28
JQuery IMG 태그 onerror 처리  (0) 2011.03.24