- 버튼 클릭시 체크 박스 선택 반전.
- prop 메서드에 함수 적용하여 사용.
등록일 : ,
최대한 간단한 소스로 체크박스 선택 반전
HTML
<input type="checkbox" name="chk" value="1" />체크1
<input type="checkbox" name="chk" value="2" checked />체크2
<input type="checkbox" name="chk" value="3" />체크3
<input type="checkbox" name="chk" value="4" checked />체크4
<input type="checkbox" name="chk" value="5" />체크5
<input type="checkbox" name="chk" value="6" checked />체크6
<br><br>
<button type="button" onclick="gogogo()">선택 반전</button>
자바스크립트
function gogogo(){
// prop 메서드에 함수를 적용하여 사용
// 함수 두번째 인자값은 체크 여부인 true, false
// 이 두번째 값을 반전 시켜서 return 함
// return 값에 따라 체크박스 선택 결정
$('[name=chk]').prop('checked', function(i, val){ return !val });
}
단 한줄 이면 충분 해용 ^^*
관련 링크
jQuery API 문서 .prop()
방문해 주셔서 감사드립니다 !!