addEventListener ignorar solo click en elemento??

[catpaw]

Holaa

Al tema:

Al dar clic en

Código HTML:

<img id="tool_edit" class="tool" src="images/deptos_info/pub_edit.png" title="Editar publicaci&oacute;n" onclick="replaceDiv('publicacion<?php echo $id_pub; ?>')" /> 

Me lanza una función que reemplaza un div por un editor, hasta aqui ok

después coloque la siguiente funcion con la intencion de que eschuce cuando el usuario de clic fuera del editor (en cualquier parte fuera del editor) y lo cierre (lanzando la funcion saveEdit que guarda el contenido del editor y lo cierra)

Código Javascript:

window.onload = function(){
    if ( window.addEventListener )
        document.body.addEventListener( 'click', saveEdit, false );
    else if ( window.attachEvent )
        document.body.attachEvent( 'onclick', saveEdit );
};
 

la función funciona bien, el problema es que la escucha el clic en la img que es para abrir el editor y obviamente no permite hacer nada por que lo cierra.

funciona perfecto si en lugar que escuche un clic, escuche dos clic (dblclick) pero no quiero que funcione al doble clic

Como puedo hacer para que me ignore el clic en la img y escuche el clic en cualquier otro lado???

[zerokilled]

buenas,
fíjate que el evento es "global"... es decir, no importa donde presiones, dentro o fuera del editor, el handler saveEdit se inicia. lo que puedes hacer es que en ese handler verifica en cual elemento se inicio el evento — event.target. luego en bucle recorres los elementos padres para determinar si alguno de ello representa el editor. en dicho caso, el handler no debe continuar — return. en caso contrario, donde ninguno representa el editor, procedes con el resto del código.

[catpaw]

Hola zerokilled gracias por contestar

hice algo tentativo por lo que entendi de tu explicacion, pero aun no comprendo como hago eso de recorrer los elementos padres??

esto es lo que llevo:

Código Javascript:

window.onload = function(){
    if ( window.addEventListener )
        document.body.addEventListener( 'click', saveEdit, false );
    else if ( window.attachEvent )
        document.body.attachEvent( 'onclick', saveEdit );
};
function saveEdit( ev ){
    var element = ev.target || ev.srcElement;
    element = element.parentNode;
    while(¿?){
        if (element==¿?){
            if ( editor ){ 
                edit_muroSQL(editor.getData(), id_publicacion);
                editor.destroy();
            }
        }
        else{   
            return;
        }
    }
}
 

gracias

[zerokilled]

básicamente tendrías que hacer esto...

Código:

while(target && target != editorBox) target = target.parentNode;
if(target) return; // hacer nada ;
...
// hacer algo ;

en la condición del while se verifica que target sea un elemento y que dicho elemento no sea el editor. mientras esa condición se cumpla, target itera por el nodo padre hasta que se agote o hasta que coincida con el elemento que representa el editor. si los nodos padres se agotan, entonces target equivale a null. luego en la condición if se verifica si target es null o un elemento. en caso de ser un elemento, se asume que el evento ocurrio dentro del editor. por tanto, se cancela el resto del proceso (return). de lo contrario, cuando target es null, se procede hacer algo.

[ClubIce]

no se si te sirva, pero lo que puedes hacer el que mediante una funcion, generes una div dinamicamente en la raiz del body que mediante css y javascript cubra todo el documento y al editor le pones un zindex superior para que sobre salga de esta div, entonses lo unico que tienes que haces es añadir el onclick a la div que cubre de esa forma no se cerrara al hacer click en el editor.

[catpaw]

gracias zerokilled voy a probar como me dices

gracias clubice