Atributo HTML deshabilitado
Definición y uso
El
disabledatributo es un atributo booleano.
Cuando está presente, especifica que el elemento debe estar deshabilitado.
Un elemento deshabilitado es inutilizable.
El
disabledatributo se puede configurar para evitar que un usuario use el elemento hasta que se cumpla alguna otra condición (como seleccionar una casilla de verificación, etc.). Luego, un JavaScript podría eliminar el valor deshabilitado y hacer que el elemento se pueda usar nuevamente.
Se aplica a
El
disabledatributo se puede utilizar en los siguientes elementos:
Ejemplos
Ejemplo de botón
Un botón deshabilitado:
<button type="button" disabled>Click Me!</button>
Ejemplo de conjunto de campos
Deshabilitar un grupo de elementos de formulario relacionados:
<fieldset disabled>
<legend>Personalia:</legend>
Name: <input type="text"><br>
Email: <input type="text"><br>
Date of birth: <input type="text">
</fieldset>
Ejemplo de entrada
Un formulario HTML con un campo de entrada deshabilitado:
<form
action="/action_page.php">
First name: <input type="text" name="fname"><br>
Last name:
<input type="text" name="lname"
disabled><br>
<input type="submit" value="Submit">
</form>
Ejemplo de grupo de opciones
Un grupo de opciones deshabilitado:
<select>
<optgroup label="German Cars" disabled>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</optgroup>
</select>
Ejemplo de opción
Una lista desplegable con una opción deshabilitada:
<select>
<option value="volvo" disabled>Volvo</option>
<option value="saab">Saab</option>
<option value="vw">VW</option>
<option value="audi">Audi</option>
</select>
Seleccionar ejemplo
Una lista desplegable deshabilitada:
<select disabled>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
Ejemplo de área de texto
Un área de texto deshabilitada:
<textarea disabled>
At w3schools.com you will learn how to make a website. We offer free tutorials in all web development technologies.
</textarea>
Compatibilidad con navegador
El disabledatributo tiene el siguiente soporte de navegador para cada elemento:
| Element | |||||
|---|---|---|---|---|---|
| button | Yes | Yes | Yes | Yes | Yes |
| fieldset | Yes | Not supported | Yes | 7.0 | Yes |
| input | 1.0 | 6.0 | 1.0 | 1.0 | 1.0 |
| optgroup | 1.0 | 8.0 | Yes | Yes | Yes |
| option | 1.0 | 8.0 | 1.0 | Yes | Yes |
| select | Yes | Yes | Yes | Yes | Yes |
| textarea | Yes | Yes | Yes | Yes | Yes |