esconder formulario al clickear afuera

mayid · #1 (**permalink**) 03/02/2010, 17:09

Estoy buscando la manera de esconder un formulario si se clickea por fuera de su div contenedor. Intento esto:

Cita:

$("body").not("#formulario").click(function(){$("# formulario").fadeOut("fast")});

Pero al hacer click dentro también se esconde. Como sería?

Dany_s · #2 (**permalink**) 03/02/2010, 18:25

lo único que se me ocurre es un condicional, si desde el elemento clickeado (incluyendo el clickeado) para atras NO existe un padre con id formulario lo escondo, quiere decir que se clickeo fuera

closest() va a buscar desde el elemento que recibio el evento un padre con id formulario que tambien incluye al actual, o sea que si clickeas en el id formulario te lo trae porque lo incluye

Código HTML:

<html>
    <head>
        <title>Ejemplo</title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>
        <script type="text/javascript">
        $( function (){
            $(document).bind("click", function (e) {
                if( ! $(e.target).closest("#formulario").length){
                    $('#formulario').hide();
                }
            });
        });
        </script>
    </head>
    <style>
        body{background-color:#999}
        form {background-color:#ccc; width:300px}
    </style>
<body>
    <div id="formulario">
        <form action="">
            <p>Formulario</p>
            <input type="text">
        </form>
    </div>
    <p>
        parrafo fuera
    </p>
</body>
</html>

mayid · #3 (**permalink**) 04/02/2010, 09:44

Funciona perfecto! Muchas gracias Dany!