llamar funcion js al pulsar sobre el documento

[roboty]

Hola tengo el siguiente problema, tengo una funcion que muestra una lista desplegable funciona correctamente con la propiedad css display:none, al pulsar sobre la lista la muestra y viceversa, pero el problema que tengo es que no se como hacer que si el usuario dejo la lista desplegada y clickea cualquier parte del documento que me cierre la lista e incluso si clickea un boton del documento.
Alguna ayuda?
saludos

[zerokilled]

buenas!

deberías crear un listener global. es decir, registrar el evento click en el documento. en el handler (la función) debes determinar a qué se le hizo click. si fue a la lista desplegable, entonces muestra u oculta según el estado actual del desplegable... o más bien dependerá exactamente de los efectos que quieras dar. si al elemento que se le hizo click fue otro que no sea la lista, entonces ocultas. esto lo logras mediante la propiedad target del objeto Event. este objeto lo recibes automáticamente como parámetro en la función registrada al evento.

Código:

document.body.addEventListener('click', function(evt){
alert(evt.target.nodeName);
});

[Alexis88]

Captura el elemento objetivo (event.target) sobre el que se dio el clic y realiza una comparación; si no es parte de la lista desplegable, ocultas a esta última.

Código Javascript:

window.addEventListener("click", function(event){
    if (event.target != lista) lista.style.display = "none";
}, false);
 

La variable lista debe contener una referencia hacia tu lista desplegable para que esto sea factible. Podrías verificar que el elemento al que se le dio clic, se encuentre entre la lista de nodos hijos de la lista desplegable.

Saludos

Edito: Se me adelantaron.

[roboty]

Hola en principio gracias a los dos por vuestra colaboracion, voy a leer sobre esto que me estais explicando y si tengo dudas ya comento aqui.
saludos.

[Italico76]

Tambien soy novato y cuando lei ambas respuestas me di cuenta de que se menos de lo que creia porque no me habia percatado de que existian eventos para el objeto window y otros para el objeto document.


Aqui explican algo de eso:

http://stackoverflow.com/questions/1...deventlistener

https://developer.mozilla.org/en-US/...ference/Events

http://stackoverflow.com/questions/9...-in-javascript

[roboty]

Bueno gracias a todos por vuestra colaboracion ya que desconocia por completo estas funciones entre otros objetos como saber el nombre del hijo del nodo padre e incluso el valor de la clase , solo decir que gracias a los expertos en javascript me esta entrando mucha curiosidad por aprender este lenguaje que aparte de importante es muy interesante.
saludos.