Quelle est la valeur appropriée pour un attribut vérifié d'une case à cocher HTML?

Nous savons tous comment former une entrée de case à cocher en HTML:

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

Ce que je ne sais pas - quelle est la valeur techniquement correcte pour une case cochée? J'ai vu tout cela fonctionner:

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

La réponse est-elle que cela n'a pas d'importance? Je ne vois aucune preuve pour la réponse marquée comme correcte ici de la spécification elle-même:

Les cases à cocher (et les boutons radio) sont des interrupteurs marche / arrêt qui peuvent être basculés par l'utilisateur. Un interrupteur est "activé" lorsque l'attribut vérifié de l'élément de contrôle est défini. Lorsqu'un formulaire est soumis, seuls les contrôles de case à cocher "on" peuvent réussir. Plusieurs cases à cocher dans un formulaire peuvent partager le même nom de contrôle. Ainsi, par exemple, les cases à cocher permettent aux utilisateurs de sélectionner plusieurs valeurs pour la même propriété. L'élément INPUT est utilisé pour créer un contrôle de case à cocher.

Selon un rédacteur de spécifications, quelle est la bonne réponse? Veuillez fournir des réponses fondées sur des preuves.

À strictement parler, vous devriez mettre quelque chose qui a du sens - selon les spécifications ici , la version la plus correcte est:

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

Pour HTML, vous pouvez également utiliser la syntaxe d'attribut vide , checked=""ou même simplement checked(pour plus stricte XHTML, c'est pas pris en charge ).

Cependant, la plupart des navigateurs prendront en charge à peu près n'importe quelle valeur entre les guillemets. Tous les éléments suivants seront vérifiés:

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

Et seuls les éléments suivants seront décochés:

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

Voir aussi cette question similaire sur disabled="disabled".

Spécifications HTML5 :

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

L'attribut de contenu désactivé est un attribut booléen.

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

La présence d'un attribut booléen sur un élément représente la vraie valeur et l'absence de l'attribut représente la fausse valeur.

Si l'attribut est présent, sa valeur doit être soit la chaîne vide, soit une valeur qui correspond à une correspondance ASCII insensible à la casse pour le nom canonique de l'attribut, sans espace blanc de début ou de fin.

Conclusion :

Les éléments suivants sont valides, équivalents et vrais :

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

Les éléments suivants ne sont pas valides :

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

L'absence de l'attribut est la seule syntaxe valide pour false :

<input />

Recommandation

Si vous vous intéressez à l'écriture de XHTML valide, utilisez checked="checked", car <input checked>n'est pas valide XHTML (mais HTML valide) et les autres alternatives sont moins lisibles. Sinon, utilisez-le <input checked>car il est plus court.

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

Ce sont également valables. Et en JavaScript:

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

tu veux ça je pense: checked='checked'

1. vérifié
2. vérifié = ""

3. vérifié = "vérifié"

   sont équivalents;

selon la case à cocher spéc. '---- ⓘ vérifié = "vérifié" ou "" (chaîne vide) ou vide Spécifie que l'élément représente un contrôle sélectionné .---'

C'est une ville assez folle que la seule façon de rendre faux vérifié est d'omettre toutes les valeurs. Avec Angular 1.x, vous pouvez faire ceci:

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

ce qui est beaucoup plus sain d'esprit, si vous devez le désactiver.

Je pense que cela peut aider:

Deuxièmement, vous devez savoir que l'attribut vérifié RETOURNE une chaîne "true", "false"
Pourquoi est-ce important? Parce que vous devez utiliser le bon type. Une chaîne, pas un booléen. Cela est également important lors de l'analyse de votre case à cocher.
$('mycheckbox')[0].checked = "true"

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

Vous devez également vous rendre compte que l'attribut "coché" sert à définir initialement la valeur de la case à cocher. Cela ne fait pas grand chose une fois que l'élément est rendu dans le DOM. Imaginez que cela fonctionne lorsque la page Web se charge et est initialement analysée.
Je vais aller avec la préférence d'IE sur celui-ci:<input type="checkbox" checked="checked"/>

Enfin, l'aspect principal de la confusion pour une case à cocher est que l'élément d'interface utilisateur de case à cocher n'est pas identique à la valeur de propriété de l'élément. Ils ne sont pas directement en corrélation. Si vous travaillez en .net, vous découvrirez que l'utilisateur "vérifiant" une case à cocher ne reflète jamais la valeur booléenne réelle transmise au contrôleur. Pour définir l'interface utilisateur, j'utilise à la fois $('mycheckbox').val(true);et$('mycheckbox').attr('checked', 'checked');

Eh bien, pour l'utiliser, je ne pense pas que les choses soient importantes (similaire à désactivé et en lecture seule), personnellement, j'utilise vérifié = "vérifié" mais si vous essayez de les manipuler avec JavaScript, vous utilisez vrai / faux