Какое правильное значение для отмеченного атрибута 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">

Является ли ответ, что это не имеет значения? Я не вижу никаких доказательств для ответа, помеченного как правильный здесь из spec:

Флажки (и переключатели) - это переключатели вкл./выкл., которые могут переключаться пользователем. Переключатель "on", когда элемент управления проверен атрибут установлен. Когда форма отправляется, флажок "on"элементы управления могут стать успешными. Несколько флажков в форме могут делиться одно и то же имя управления. Так, например, флажки позволяют пользователям выберите несколько значений для того же свойства. Используется элемент INPUT для создания элемента управления флажком.

Что сказал бы автор спекта, правильный ответ? Просьба предоставить доказательства, основанные на доказательствах.

398
21 окт. '11 в 18:41
источник поделиться
8 ответов

Строго говоря, вы должны поместить что-то, что имеет смысл - согласно спецификации здесь, самая правильная версия:

<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".

426
21 окт. '11 в 18:51
источник

Спецификация HTML5:

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

Отключенный атрибут content является логическим атрибутом.

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

Наличие логического атрибута для элемента представляет истинное значение, а отсутствие атрибута представляет ложное значение.

Если атрибут присутствует, его значение должно быть либо пустой строкой, либо значением, которое не соответствует значению 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>, поскольку он короче.

48
05 июля '14 в 19:26
источник
<input ... checked />
<input ... checked="checked" />

Это одинаково справедливо. И в JavaScript:

input.checked = true;
input.setAttribute("checked");
input.setAttribute("checked","checked");
34
21 окт. '11 в 18:42
источник

ты хочешь этого, я думаю: checked='checked'

7
21 окт. '11 в 18:42
источник
  • checked
  • проверено = ""
  • проверил = "проверено"

    эквивалентны;


согласно spec checkbox '---- ⓘ checked = "checked" или "" (пустая строка) или пустой   Указывает, что элемент представляет выбранный элемент управления.---

5
05 июня '14 в 6:41
источник

Это довольно сумасшедший город, единственный способ сделать проверенный false - опустить любые значения. С помощью Angular 1.x вы можете сделать это:

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

что намного более разумно, если вам нужно сделать его непроверенным.

2
15 марта '17 в 1:37
источник

Я думаю, что это может помочь:


Сначала прочитайте все спецификации от Microsoft и W3.org.
Вы увидите, что установка фактического элемента флажка должна быть сделана для СОБСТВЕННОСТИ ЭЛЕМЕНТА, а не для пользовательского интерфейса или атрибута.
$('mycheckbox')[0].checked

Во-вторых, вам нужно знать, что проверенный атрибут ВОЗВРАЩАЕТ строку "true", "false"
Почему это важно? Потому что вам нужно использовать правильный тип. Строка, а не логическое значение. Это также важно при разборе вашего флажка.
$('mycheckbox')[0].checked = "true"

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

Вы также должны понимать, что "флажок" ATTRIBUTE предназначен для первоначальной установки значения флажка. Это мало что делает, когда элемент отображается в DOM. Представьте себе, как это работает, когда веб-страница загружается и анализируется изначально.
Я остановлюсь на настройках IE: <input type="checkbox" checked="checked"/>

Наконец, главный аспект путаницы для флажка заключается в том, что элемент пользовательского интерфейса флажка не совпадает со значением свойства элемента. Они не соотносятся напрямую. Если вы работаете в .net, вы обнаружите, что пользователь, "проверяющий" флажок, никогда не отражает фактическое значение bool, переданное контроллеру. $ ( 'Mycheckbox') вал (истина).


Короче говоря, для установленного флажка вам нужно:
Начальный DOM: <input type="checkbox" checked="checked">
Свойство элемента: $('mycheckbox')[0].checked = "true";
Пользовательский интерфейс: $('mycheckbox').val(true);

Просто как выражение об отказе от ответственности... даже зная все это, я иногда сталкиваюсь с забавными результатами. Таким образом, чтобы быть многословным, при изменении его части пользовательского интерфейса я также установил атрибут checked="checked" или removeAttr при снятии флажка.
0
31 янв. '19 в 23:20
источник

Ну, чтобы использовать его, я не думаю, что имеет значение (аналогично отключенному и readonly), лично я использую check = "checked", но если вы пытаетесь манипулировать ими с помощью JavaScript, вы используете true/false

-2
21 окт. '11 в 18:43
источник

Посмотрите другие вопросы по меткам или Задайте вопрос