코딩/Javascript

TIL(23.05.04) - jQuery 활용한 checkbox 로직구현

AMD만세 2023. 5. 4. 14:48

1) 이번주 배운 내용

전체: chkAll

내용1, 내용2, 내용3: chkLogIn, chkLastReservation, chkLastVisit

//SearchBox 내 체크박스(전체체크여부)
  , fnSetCheckBoxAll : () => {
    $('#chkAll').click(function(){
			var checkedAll = $('#chkAll').is(':checked');
			if(checkedAll) {
				$('#chkLogIn, #chkLastReservation, #chkLastVisit').prop('checked',true);
			} else {
				$('#chkLogIn, #chkLastReservation, #chkLastVisit').prop('checked',false);
			}
		});
  }
  //SearchBox 내 체크박스(각각체크여부)
  , fnSetCheckBoxEach : () => {
	  $('#chkLogIn, #chkLastReservation, #chkLastVisit').click(function(){
		  if($('#chkLogIn').is(':checked') && $('#chkLastReservation').is(':checked') && $('#chkLastVisit').is(':checked')) {
				$('#chkAll').prop('checked',true);
			} else {
				$('#chkAll').prop('checked',false);
			}
		})
	}

 

2) Trouble Shooting

$('#~').is(':checked') 같은 건 변수 설정해주는 게 편리할 것 같다.

(코드가 주구장창 길어져보임)