Código de JQuery - Evento click() en un botón deshabilitado

Imágen de perfil

Evento click() en un botón deshabilitadográfica de visualizaciones


JQuery

Publicado el 14 de Marzo del 2014 por Xavi
4.437 visualizaciones desde el 14 de Marzo del 2014. Una media de 35 por semana
Código que muestra como simular un botón desactivado para que funcione el evento click()

Versión 1

Publicado el 14 de Marzo del 2014gráfica de visualizaciones de la versión: Versión 1
4.438 visualizaciones desde el 14 de Marzo del 2014. Una media de 35 por semana
estrellaestrellaestrellaestrellaestrella
estrellaestrellaestrellaestrella
estrellaestrellaestrella
estrellaestrella
estrella

Puedes ver el ejemplo aquí
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
56
57
<!DOCTYPE html>
<html lang="es">
<head>
    <title>Evento click() en un botón desactivado</title>
    <meta charset="utf-8">
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <script>
 
        // variable que determina si el boton esta o no habilitado
        var botonDisabled=true;
 
        $(document).ready(function(){
 
            // evento click del boton
            $("#boton").click(function(){
                if(botonDisabled)
                {
                    alert("El botón esta deshabilitado");
                }else{
                    alert("El botón esta habilitado");
                }
            });
 
            // evento click en el check para activar o desactivar el boton
            $("#enableDisable_Button").click(function(){
                if(botonDisabled==true)
                {
                    //habilitamos el boton
                    $("#boton").removeClass("disabled");
                    botonDisabled=false;
                }else{
                    // simula el boton deshabilitado
                    $("#boton").addClass("disabled");
                    botonDisabled=true;
                }
            });
        });
 
    </script>
    <style>
        /* clase que determina como se muestra el boton deshabilitado */
        #boton.disabled {color:graytext;}
    </style>
</head>
 
<body>
 
<h1>Evento click() en un botón desactivado</h1>
 
<form>
    <input type="button" id="boton" value="Botón" class="disabled">
 
    <p><input type="checkbox" id="enableDisable_Button">Activar/Desactivar botón</p>
</form>
 
</body>
</html>



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


No hay comentarios
 

Comentar la versión: Versión 1

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

http://lwp-l.com/s2627