HTML 체크 박스의 체크 된 속성에 적절한 값은 무엇입니까?

우리는 모두 HTML로 체크 박스 입력을하는 방법을 알고 있습니다 :

<input name="checkbox_name" id="checkbox_id" type="checkbox">

내가 모르는 것-체크 박스의 기술적으로 올바른 값은 무엇입니까? 나는 이것들이 모두 작동하는 것을 보았다.

<input name="checkbox_name" id="checkbox_id" type="checkbox" checked>
    <input name="checkbox_name" id="checkbox_id" type="checkbox" checked="on">
    <input name="checkbox_name" id="checkbox_id" type="checkbox" checked="yes">
    <input name="checkbox_name" id="checkbox_id" type="checkbox" checked="checked">
    <input name="checkbox_name" id="checkbox_id" type="checkbox" checked="true">

중요하지 않은 대답입니까? 나는 올바른로 표시 답에 대한 증거를 볼 수 없습니다 여기 로부터 사양 자체를 :

확인란 (및 라디오 버튼)은 사용자가 전환 할 수있는 켜기 / 끄기 스위치입니다. 제어 요소의 점검 속성이 설정되면 스위치가 "켜짐"입니다. 양식을 제출하면 "on"확인란 컨트롤 만 성공할 수 있습니다. 폼의 여러 확인란은 동일한 컨트롤 이름을 공유 할 수 있습니다. 예를 들어 확인란을 사용하면 동일한 속성에 대해 여러 값을 선택할 수 있습니다. INPUT 요소는 확인란 컨트롤을 만드는 데 사용됩니다.

스펙 작성자는 정답이 무엇이라고 말합니까? 증거 기반 답변을 제공하십시오.

엄밀히 말하면, 여기 에있는 사양에 따라 가장 적합한 버전을 넣어야합니다 .

<input name=name id=id type=checkbox checked=checked>

HTML를 들어, 당신은 또한 사용할 수있는 빈 속성 구문을 , checked="", 또는 단순히 checked(엄격한 XHTML을 위해,이되어 지원되지 않음 ).

그러나 사실상 대부분의 브라우저는 따옴표 사이의 값만 지원합니다. 다음이 모두 확인됩니다.

<input name=name id=id type=checkbox checked>
<input name=name id=id type=checkbox checked="">
<input name=name id=id type=checkbox checked="yes">
<input name=name id=id type=checkbox checked="blue">
<input name=name id=id type=checkbox checked="false">

그리고 다음 만이 체크되지 않습니다 :

<input name=name id=id type=checkbox>

에서 이와 비슷한 질문을 참조하십시오 disabled="disabled".

HTML5 사양 :

http://www.w3.org/TR/html5/forms.html#attr-input-checked :

비활성화 된 컨텐츠 속성은 부울 속성입니다.

http://www.w3.org/TR/html5/infrastructure.html#boolean-attributes :

요소에 부울 속성이 있으면 true 값을 나타내고 속성이 없으면 false 값을 나타냅니다.

속성이 존재하는 경우, 값은 빈 문자열이거나 속성의 정식 이름에 대해 대소 문자를 구분하지 않는 ASCII 문자열이거나 선행 또는 후행 공백이 없어야합니다.

결론 :

다음은 유효하고 동일하며 사실입니다 .

<input type="checkbox" checked />
<input type="checkbox" checked="" />
<input type="checkbox" checked="checked" />
<input type="checkbox" checked="ChEcKeD" />

다음은 유효하지 않습니다 :

<input type="checkbox" checked="0" />
<input type="checkbox" checked="1" />
<input type="checkbox" checked="false" />
<input type="checkbox" checked="true" />

이 속성이 없으면 false 의 유일한 올바른 구문입니다 .

<input />

추천

유효한 XHTML을 작성하는 데 관심이있는 경우을 사용하십시오 checked="checked". <input checked>유효하지 않은 XHTML (유효한 HTML)이므로 다른 대안은 읽기 어렵 기 때문입니다. 그렇지 않으면 <input checked>짧게 사용하십시오.

<input ... checked />
<input ... checked="checked" />

그것들은 똑같이 유효합니다. 그리고 JavaScript에서 :

input.checked = true;
input.setAttribute("checked");
input.setAttribute("checked","checked");

당신은 이것을 내가 생각하기를 원합니다 : checked='checked'

1. 확인
2. checked = ""

3. checked = "checked"

   동등하다;

사양 확인란 에 따라 '---- checked = "checked"또는 ""(빈 문자열) 또는 비어 있음 요소가 선택된 컨트롤을 나타내도록 지정합니다 .---'

확인 된 거짓을 만드는 유일한 방법은 모든 값을 생략하는 것입니다. Angular 1.x를 사용하면 다음을 수행 할 수 있습니다.

  <input type="radio" ng-checked="false">

선택을 해제 해야하는 경우 훨씬 더 제정신입니다.

나는 이것이 도움이 될 것이라고 생각한다.

두 번째로, 점검 된 속성이 문자열 "true", "false"를 리턴한다는 것을 알아야합니다.
왜 이것이 중요합니까? 올바른 유형을 사용해야하기 때문입니다. 부울이 아닌 문자열. 확인란을 구문 분석 할 때도 중요합니다.
$('mycheckbox')[0].checked = "true"

if($('mycheckbox')[0].checked === "true"){ //do something }

또한 "checked"ATTRIBUTE는 확인란의 값을 처음 설정하는 것임을 알아야합니다. 요소가 DOM에 렌더링되면 많은 작업을 수행하지 않습니다. 웹 페이지가로드되고 처음 파싱 될 때이 작업이 작동하는 것으로 묘사하십시오.
나는 이것에 대한 IE의 선호와 함께 갈 것이다.<input type="checkbox" checked="checked"/>

마지막으로, 확인란의 혼동의 주요 측면은 확인란 UI 요소가 요소의 속성 값과 동일하지 않다는 것입니다. 그것들은 직접적으로 상관되지 않습니다. .net에서 작업하는 경우 사용자가 확인란을 "확인"하면 컨트롤러에 전달 된 실제 부울 값이 반영되지 않습니다. UI를 설정하려면, 내가 사용하는 모두 $('mycheckbox').val(true);와$('mycheckbox').attr('checked', 'checked');

글쎄, 그것을 사용하기 위해 문제를 생각하지 않습니다 (비활성화 및 읽기 전용과 유사), 개인적으로 checked = "checked"를 사용하지만 JavaScript로 조작하려고하면 true / false를 사용합니다