Código de JQuery - Poner y quitar el atributo readOnly en un input

Imágen de perfil

Poner y quitar el atributo readOnly en un inputgráfica de visualizaciones


JQuery

estrellaestrellaestrellaestrellaestrella(1)
Publicado el 02 de Febrero del 2015 por xve
6.366 visualizaciones desde el 02 de Febrero del 2015. Una media de 70 por semana
En este ejemplo, se muestra como aplicar el atributo de solo lectura readlonly a un cuadro de texto, como eliminarlo y como saber si esta aplicado o no dicho atributo.

Versión 1.0
estrellaestrellaestrellaestrellaestrella(1)

Actualizado el 03 de Febrero del 2015 (Creado el 02 de Febrero del 2015)gráfica de visualizaciones de la versión: Versión 1.0
6.367 visualizaciones desde el 02 de Febrero del 2015. Una media de 70 por semana
estrellaestrellaestrellaestrellaestrella
estrellaestrellaestrellaestrella
estrellaestrellaestrella
estrellaestrella
estrella

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="utf-8">
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js" type="text/javascript"></script>
 
    <script>
    function ponerReadOnly(id)
    {
        // Ponemos el atributo de solo lectura
        $("#"+id).attr("readonly","readonly");
        // Ponemos una clase para cambiar el color del texto y mostrar que
        // esta deshabilitado
        $("#"+id).addClass("readOnly");
    }
 
    function quitarReadOnly(id)
    {
        // Eliminamos el atributo de solo lectura
        $("#"+id).removeAttr("readonly");
        // Eliminamos la clase que hace que cambie el color
        $("#"+id).removeClass("readOnly");
    }
 
    /**
     * Mostramos en un alert si esta el atributo de solo lectura activado
     */
    function estado(id)
    {
        if($("#"+id).attr("readonly"))
        {
            alert("Tiene el atributo de solo lectura");
        }else{
            alert("NO Tiene el atributo de solo lectura");
        }
    }
    </script>
 
    <style>
    .readOnly {color:#808080;}
    input {width:200px;}
    </style>
</head>
 
<body>
 
<form>
    <input type="text" name="nombre" value="cualquier texto" id="idNombre">
    <br><input type="button" value="poner atributo ReadOnly" onclick="ponerReadOnly('idNombre')">
    <br><input type="button" value="quitar atributo ReadOnly" onclick="quitarReadOnly('idNombre')">
    <br><input type="button" value="Estado" onclick="estado('idNombre')">
</form>
 
</body>
</html>



Comentarios sobre la versión: Versión 1.0 (1)

12345
03 de Agosto del 2016
estrellaestrellaestrellaestrellaestrella
´muy bueno
Responder

Comentar la versión: Versión 1.0

Nombre
Correo (no se visualiza en la web)
Valoración
Comentarios

http://lwp-l.com/s3027