Javascript-full-stack

[Javascript] 체크박스 비활성화

내가갈게하와이 2022. 4. 12. 09:12

HTML 소스코드

전체 : <input type="checkbox" name="size" value="95" id="totall3"> 
SKT : <input type="checkbox" name="size" value="100" class="moblieRest"> 
KT : <input type="checkbox" name="size" value="105" class="moblieRest">
LGU+ : <input type="checkbox" name="size" value="110" class="moblieRest">

위와 같은 input태그에 checkbox 타입을 가지고 있는 코드가 있다고 하자. 

전체 체크박스를 선택했을 때 다른 체크박스들이 비활성 되는 상황을 만들려고 한다.

 

  $(document).ready(function(){
 
  
  $("#totall3").click(function(){
		
		if(this.checked){
			$(".moblieRest").prop("disabled",true);
		}
		else{
			$(".moblieRest").prop("disabled",false);
		}
	});
    
   });

전체 체크박스 id를 jquery를 이용해 선택되었을 때 나머지 체크박스는 class로 접근해 비활성화 시켜준다. 

체크박스 비활성화

 

체크박스 활성화

'Javascript-full-stack' 카테고리의 다른 글

위치 정렬 - grid 1  (0) 2022.02.13
위치 정렬 - flex item  (0) 2022.01.31
위치 정렬 - flex container: 정렬3  (0) 2022.01.31
위치 정렬 - flex container: 정렬2  (0) 2022.01.31
위치 정렬 - flex container: 정렬1  (0) 2022.01.30