Javascript(Jquery)

[jQuery] CheckBox checked Option 사용

Jeong Jeon
반응형

1). Jsp

 

<label class="ckb" for="bus_in"><input type="checkbox" id="bus_in" name="goback"><span class="checkmark">등원</span></label>

<label class="ckb" for="bus_out"><input type="checkbox" id="bus_out" name="goback"><span class="checkmark">하원</span></label>

 

 

2). javascript.js

  • .is(":checked") 메소드를 사용하여 현재 체크되있는지 값을 확인 할수 있다.

if($("input:checkbox[id='bus_in']").is(":checked")){

	alert($(this).attr('id')+": checked")

}

 

CheckBox를 사용할때 attr과 prop 옵션 두가지를 사용하여 handling 할 수있다.

 

  • .attr("checked" , true); 를 사용하여 Attribute를 변경하여 check 상태를 Control 할 수 있다.   

  • 하지만 checked옵션만으로는 화면상 체크가 되어있는지는 표시가 되지않음을 유의하라

  • attr은 값을 뽑아내고 싶을때 사용하면 될것이다.

 

//속성값에 checked 표시

$("input:checkbox[id='go_mon']").attr("checked", true);



//속성값에 checked 미표시

$("input:checkbox[id='go_mon']").attr("checked", false);

 

ex). attr기능을 통한 True 적용

  • prop("checked",true)은 checked value를 handling 하지 않는다.

  • 화면상 check가 되어있는지 안되어있는지만을 handling 할수 있다.

  • attr과 구분해서 사용하기를 바란다.

//체크표시

$("input:checkbox[id='go_mon']").prop("checked", true);



//체크 미표시

$("input:checkbox[id='go_mon']").prop("checked", false);

ex). prop기능을 통한 True 적용

## $("input:checkbox[id='go_mon']").prop('checked') 으로 체크되있는지 찾아볼수 있다.

반응형