¿Cuál es el valor correcto para el atributo deshabilitado?

167

¿Cuál es el valor correcto para el disabledatributo de un cuadro de texto o área de texto?

He visto lo siguiente usado antes:

<input type="text" disabled />
<input type="text" disabled="disabled" />
<input type="text" disabled="true" />
html textbox textarea tskuzzy
fuente
55
Los atributos deben tener un valor, incluso para los atributos cuya mera presencia indica que se debe hacer algo. disabled="false"aún deshabilitaría el elemento, porque es la PRESENCIA de lo disabledque desencadena la deshabilitación, no el valor del atributo.
Marc B
El enlace que publiqué como comentario a la respuesta de js1568 confirma / aclara lo que dice @Marc B: whatwg.org/specs/web-apps/current-work/multipage/…
James Allardice
posible duplicado de stackoverflow.com/questions/1033944/… porque ambos son atributos booleanos (no marcados)
Ciro Santilli 郝海东 冠状 病 六四 事件 法轮功

Respuestas:

148
  • Para XHTML, <input type="text" disabled="disabled" />es el marcado válido.
  • Para HTML5, <input type="text" disabled />es válido y lo utiliza W3C en sus muestras.
  • De hecho, ambas formas funcionan en todos los principales navegadores.
Erick Petrucelli
fuente
15
En html5, la entrada es un elemento vacío y no necesita una barra oblicua: w3.org/TR/html5/syntax.html#void-elements y w3.org/TR/html5/syntax.html#syntax-start- etiqueta
Daniel
1
@Daniel K. No lo necesita, a menos que se realice un marcado HTML / XML políglota.
Patanjali
108

Especificación HTML5 :

http://www.w3.org/TR/html5/forms.html#enabling-and-disabling-form-controls:-the-disabled-attribute :

El atributo de contenido marcado es un atributo booleano

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

La presencia de un atributo booleano en un elemento representa el valor verdadero, y la ausencia del atributo representa el valor falso.

Si el atributo está presente, su valor debe ser la cadena vacía o un valor que sea una coincidencia entre mayúsculas y minúsculas ASCII para el nombre canónico del atributo, sin espacios en blanco iniciales o finales.

conclusión :

Los siguientes son válidos, equivalentes y verdaderos :

<input type="text" disabled />
<input type="text" disabled="" />
<input type="text" disabled="disabled" />
<input type="text" disabled="DiSaBlEd" />

Los siguientes no son válidos :

<input type="text" disabled="0" />
<input type="text" disabled="1" />
<input type="text" disabled="false" />
<input type="text" disabled="true" />

La ausencia del atributo es la única sintaxis válida para falso :

<input type="text" />

Recomendación

Si le interesa escribir XHTML válido, use disabled="disabled", ya <input disabled>que no es válido y otras alternativas son menos legibles. De lo contrario, solo utilícelo <input disabled>ya que es más corto.

Ciro Santilli 郝海东 冠状 病 六四 事件 法轮功
fuente
3
Nota: Si usa AngularJS y necesita vincular el estado deshabilitado a una variable, puede usarlo ng-disableden su lugar. Similar a otros atributos como este, generalmente tienen una ng-*contraparte inteligente
jakub.g
55
disabled={true}funciona en el código JSX de reactJs pero estoy seguro de que se transpilaría a uno de los formatos HTML5 válidos / permitidos solamente
RBT
1

Acabo de probar todo esto, y para IE11, lo único que parece funcionar es deshabilitado = "verdadero". Los valores deshabilitados o sin valor dado no funcionaron. De hecho, el jsp obtuvo un error que requiere igual para todos los campos, así que tuve que especificar disabled = "true" para que esto funcione.

Edmond ME
fuente
1
La pregunta de OP era sobre HTML (es decir, controles del lado del cliente). Estás mirando los controles del lado del servidor; los que tienen diferentes convenciones. Notarás la diferencia si inspeccionas la salida HTML de tu JSP. Si aún tiene dudas, pruebe este violín en IE11.
Ruud Helderman el
He visto lo mismo en el lado del cliente en IE 11. IE 11 obliga a que exista algo, así que simplemente configurando los resultados deshabilitados en disabled = ""
Robert Achmann
1

En HTML5, no hay un valor correcto, a todos los principales navegadores realmente no les importa cuál es el atributo, solo están verificando si el atributo existe para que el elemento esté deshabilitado.

MadsHaupt
fuente