.prop ( 'checked', false) 또는 .removeAttr ( 'checked')?


115

prop 메소드의 도입으로 이제 허용되는 확인란 선택 해제 방법을 알아야합니다. 그것은 :

$('input').filter(':checkbox').removeAttr('checked');

또는

$('input').filter(':checkbox').prop('checked',false);

4
John Resig의 게시물을 읽었습니까? ejohn.org/blog/jquery-16-and-attr
Jared Farrish

답변:


130

jQuery 3

jQuery 3부터는 해당 속성을 더 이상 설정 removeAttr하지 않습니다false .

사용 jQuery를 3.0 이전 .removeAttr()부울 속성에 같은 checked, selected또는 readonly도에 해당라는 이름의 속성을 설정합니다 false. 이 동작은 이전 버전의 Internet Explorer에 필요했지만 특성이 초기 값을 나타내고 속성이 현재 (동적) 값을 나타 내기 때문에 최신 브라우저에는 올바르지 않습니다.

.removeAttr( "checked" )DOM 요소 에서 사용하는 것은 거의 항상 실수 입니다. 유용 할 수있는 유일한 경우는 DOM이 나중에 HTML 문자열로 다시 직렬화되는 경우입니다. 다른 모든 경우에는를 .prop( "checked", false )대신 사용해야합니다.

변경 로그

따라서이 .prop('checked',false)버전을 사용할 때만 올바른 방법입니다.


원래 답변 (2011 년부터) :

기본 부울 속성 (그 checked중 하나) removeAttr이있는 속성의 경우 기본 속성을로 자동 설정합니다 false. (이것은 jQuery 1.6.1에 추가 된 이전 버전과의 호환성 "수정"중 하나입니다.)

따라서 둘 중 하나가 작동하지만 ... 두 번째 예 (를 사용하여 prop)가 둘 중 더 정확합니다. 체크 박스의 선택을 취소하는 것이 목표 인 경우 속성 이 아닌 속성에 실제로 영향을 미치고 싶을 것이며 removeAttr이를 수행 할 필요가 없습니다 .


36
@tandu : 할 수 있지만해서는 안됩니다. 문서에서 : " 참고 :removeProp() 선택됨, 비활성화 됨 또는 선택됨과 같은 기본 속성을 제거 하는 데 [ ]를 사용하지 마십시오 . 이렇게하면 속성이 완전히 제거되고 제거 된 후에는 요소에 다시 추가 할 수 없습니다. .prop()이러한 속성을 false로 설정 하려면 사용하십시오. 대신. " removeProp실제로 사용자 지정 속성에만 사용하기위한 것입니다.
John Flatness

17

use checked: true, false 확인란의 속성입니다.

jQuery :

if($('input[type=checkbox]').is(':checked')) {
    $(this).prop('checked',true);
} else {
    $(this).prop('checked',false);
}

if, 그렇지 않으면 하나의 라이너를 사용하여 제거 할 수 있습니다. $ (this) .prop ( 'checked', $ ( 'input [type = checkbox]'). is ( ': checked'));
Yousaf Hassan 19 년

8

Chrome에 문제가있어서 두 기능을 모두 사용하여 해결했기 때문에 prop 및 attr을 모두 사용하는 것이 좋습니다.

if ($(':checkbox').is(':checked')){
    $(':checkbox').prop('checked', true).attr('checked', 'checked');
}
else {
    $(':checkbox').prop('checked', false).removeAttr('checked');
}

예, 크롬의 경우 다음을 사용합니다. $("input[type='checkbox'], input[type='radio']").prop("checked", false).attr("checked", false).removeAttr("checked");
Rod

사용자 정의 구성 요소 (CSS + JS)를 사용하여 입력 라디오와 확인란을 대체합니다. 이것은 나를 위해 일하는 유일한 방법입니다. 감사!
Silvio Delgado

3

동일한 작업을 수행하는 또 다른 대안은 type = checkbox 속성 을 필터링하는 것입니다 .

$('input[type="checkbox"]').removeAttr('checked');

또는

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

속성과 속성의 차이는 특정 상황에서 중요 할 수 있음을 기억하십시오. jQuery 1.6 이전 에는 .attr () 메서드가 일부 속성을 검색 할 때 속성 값을 고려하여 일관성없는 동작을 유발할 수 있습니다. jQuery 1.6부터 .prop () 메서드는 속성 값을 명시 적으로 검색하는 방법을 제공하는 반면 .attr ()은 속성을 검색합니다.

더 알고 ...


2
질문은 "이 작업을 수행하는 다른 방법이 있습니까?"가 아니라 "이 중 어느 것이 더 정확한지"였습니다. 당신은 질문에 대답하려고했습니다 나타나지 않습니다
앤드류 스텁 스에게
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.