Каково правильное значение для отмеченного атрибута флажка HTML?

Question

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

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

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

Что, по словам автора спецификации, является правильным ответом? Пожалуйста, предоставьте обоснованные ответы.

484

html forms checkbox html-input

Источник

user317937 21 окт '11 в 15:41

10 ответов

Решение

HTML5 spec:

http://www.w3.org/TR/html5/forms.html:

Атрибут отключенного содержимого является логическим атрибутом.

http://www.w3.org/TR/html5/infrastructure.html:

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

70

Источник

user895245 05 июл '14 в 16:26

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

Те одинаково действительны. И в JavaScript:

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

38

Источник

user507674 21 окт '11 в 15:42

Вы хотите этого, я думаю:checked='checked'

7

Источник

user852659 21 окт '11 в 15:42

проверено
проверено =""
проверено = "проверено"
эквивалентны;

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

6

Источник

user2861901 05 июн '14 в 03:41

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

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

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

3

Источник

user1223975 14 мар '17 в 22: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').val(true); а также $('mycheckbox').attr('checked', 'checked');

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

2

Источник

user9242504 31 янв '19 в 20:20

Как и все входные данные, этот также имеет атрибут «значение». Если вы установите value атрибут вместе с name атрибут, он отправит ${name}=${value}в заголовках. Допустим, у нас есть форма с кучей вещей, и мы хотим, чтобы пользователь сам решил, какие роли у них есть, мы могли бы использовать флажок. Самый простой способ - установить атрибут «значение», который будет передаваться на сервер. Как это:

      <form action="/server" method="post">
    <label>Are you a person?</label>
    <input type="checkbox" name="my_checkbox" value="is_person">
</form>

Сервер получит следующее: my_checkbox=is_personно только если флажок установлен. Это было бы my_checkbox= если он пуст.

То же самое и с radio входы.

Но ... у меня такое чувство, что вы просите не об этом ... Так что просто заключите, я напишу еще один ответ ниже:

Если для атрибута установлено какое-либо значение (даже), он будет активирован, несмотря ни на что. Атрибут не имеет указанного значения, если для него установлено какое-либо значение, по умолчанию будет установлено значение «true» (даже если вы установите для него значение false).

Например:

      <form action="/server" method="post">
    <label>Are you a person?</label>
    <input type="checkbox" checked="false"> <!--Still checked-->
</form>

Будет проверяться, даже если для него установлено значение false.

      <form action="/server" method="post">
    <label>Are you a person?</label>
    <input type="checkbox" checked="asjdiasjiasdjoasi"> <!--Still checked-->
</form>

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

Надеюсь, это ответит на ваш вопрос, checked attribute проверит ввод независимо от значения атрибута.

Вы можете протестировать его здесь: https://battledash-2.github.io/Live-IDE/ или где угодно, например, repl.it, или локально.

1

Источник

user14337344 06 апр '21 в 19:56

Технически правильное значение для установленного флажка - ноль (0), а когда флажок не установлен, его индекс не определен.

0

Источник

user16517155 02 авг '21 в 22:51

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

-2

Источник

user1005920 21 окт '11 в 15:43

Другие вопросы по тегам html forms checkbox html-input

user832136 21 окт '11 в 15:51 2011-10-21 15:51 · Accepted Answer · 2011-10-21 15:51

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

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