Validación HTML: Valor incorrecto "true" para el atributo "disabled" en el elemento "input".

Acerca de este problema HTML

En HTML, los atributos booleanos funcionan de manera diferente a lo que podrías esperar de los lenguajes de programación. No aceptan "true" o "false" como valores. En su lugar, la presencia del atributo significa que está activo, y su ausencia significa que está inactivo. Esto está definido en el WHATWG HTML Living Standard, que establece que el valor de un atributo booleano debe ser la cadena vacía o una coincidencia insensible a mayúsculas/minúsculas con el nombre del atributo.

Esto significa que hay exactamente tres formas válidas de escribir el atributo disabled:

disabled (sin valor)
disabled="" (cadena vacía)
disabled="disabled" (nombre del atributo como valor)

Cualquier otro valor — incluyendo "true", "false", "yes", "no", o "1" — es inválido y provocará un error de validación W3C.

Un malentendido común y peligroso es que disabled="false" hará que un elemento no esté deshabilitado. No lo hará. Como los atributos booleanos se activan únicamente por su presencia, disabled="false" aún deshabilita el elemento. El navegador ve que el atributo disabled está presente y trata el elemento como deshabilitado, ignorando completamente el valor "false". Esto puede llevar a errores confusos donde los elementos parecen permanentemente deshabilitados.

Este problema afecta a todos los elementos que soportan el atributo disabled, incluyendo <input>, <button>, <select>, <textarea>, <fieldset>, <optgroup>, y <option>. Las mismas reglas se aplican a otros atributos booleanos como checked, readonly, required, autofocus, y hidden.

Por qué importa esto

Cumplimiento de estándares: Usar valores de atributo inválidos viola la especificación HTML y produce errores de validación W3C.
Mantenibilidad: Los desarrolladores que leen disabled="true" o disabled="false" pueden malinterpretar la intención, especialmente si asumen que "false" elimina el estado deshabilitado.
Trampas de frameworks: Algunos frameworks de JavaScript establecen dinámicamente disabled="true" o disabled="false" como valores de cadena. Cuando el HTML renderizado llega al navegador, ambos valores resultan en un elemento deshabilitado, que rara vez es el comportamiento deseado.

Cómo solucionarlo

Para deshabilitar un elemento, agrega el atributo disabled sin valor, o usa disabled="" o disabled="disabled".
Para habilitar un elemento, elimina el atributo disabled completamente. No lo establezcas como "false".
En JavaScript, usa la propiedad DOM element.disabled = true o element.disabled = false, o usa element.removeAttribute('disabled') para habilitarlo. Evita element.setAttribute('disabled', 'false').

Ejemplos

❌ Inválido: usando `"true"` y `"false"` como valores

<form>
  <input type="text" disabled="true">
  <select disabled="false">
    <option>Option A</option>
  </select>
  <button type="submit" disabled="true">Submit</button>
</form>

Tanto los valores "true" como "false" son inválidos. Además, disabled="false" aún deshabilita el elemento <select>, lo cual casi seguramente no es lo que se pretendía.

✅ Válido: uso correcto del atributo booleano

<form>
  <input type="text" disabled>
  <select>
    <option>Option A</option>
  </select>
  <button type="submit" disabled="disabled">Submit</button>
</form>

Aquí, el <input> y el <button> están deshabilitados usando sintaxis válida. El <select> está habilitado porque el atributo disabled ha sido eliminado completamente.

✅ Válido: alternando el estado deshabilitado con JavaScript

<form>
  <input type="text" id="username" disabled>
  <button type="button" id="toggle">Enable field</button>
  <script>
    document.getElementById('toggle').addEventListener('click', function () {
      var field = document.getElementById('username');
      field.disabled = !field.disabled;
    });
  </script>
</form>

Usar la propiedad DOM disabled (un booleano real) es la forma correcta de alternar el estado deshabilitado dinámicamente. Esto evita la trampa de establecer valores de cadena como "true" o "false" en el atributo.