La propiedad Disabled en Javascript


Como atributo de un elemento HTML

Ejemplo: "Solo añadiendo el atributo disabled".

<input type="button" value="Desactivado" disabled />
<input type="text" disabled />
<input type="button" value="Boton normal" />
Demostración: El botón y el campo de texto están desactivados

Manipulando Disabled usando Javascript

Ejemplo 1: Utilizando el "id" del campo de texto en este caso "miText".
<script type="text/javascript">
    function Desactivar(){
        document.getElementById('miText').disabled = true;
    }
</script>

<input type="button" value="Desactivar" onclick="Desactivar()" />
<input type="text" id="miText" />
Demostración: Dándole clic al botón se desactiva el campo de texto.

Ejemplo 2:Utilizando el evento "onclick".

<input type="button" value="Desactivar" onclick="document.getElementById('miText').disabled=true"/>
<input type="text" id="miText" />
Demostración:

Disable en archivos externos

Ejemplo 1:
 Archivo Css externo "Estilo.css"

label.miEstilo{
    border:1px solid black;
    background:olive;
}

 Archivo HTML

<html>
<head>
    <link id="Link" rel="stylesheet" type="text/css"  href="Estilo.css" />
    <script type="text/javascript">
        function CambiarCss(){
            var link = document.getElementById('Link');
            link.disabled = !link.disabled;
        }
    </script>
</head>

<body>
    <input type="button" value="Css" onclick="CambiarCss()"/></br>
    <label class="miEstilo">Esto es un Ejemplo</label>
</body>
</html>
Demostración :
       ---> Se activa o desactiva el archivo externo css

2 comentarios: