Función cuando se pierde focus

xinxan22 · #1 (**permalink**) 28/08/2008, 06:13

Buenos días, me gustaría saber como puedo llamar a una función cuando se pierda el focus de, por ejemplo, una etiqueta <div>. Lo que quiero realmente es tener una etiqueta <div> con información para poder clicar y demás cosas, si un usuario hace clic fuera de la etiqueta <div> o escribe algun texto en un formulario de otra parte de la página, automáticamente se oculte la etiqueta <div> (para eso simplement seria cuando se pierda el focus de la etiqueta div llamar a la función ocultar_div, esa parte no hace falta).

Panino5001 · #2 (**permalink**) 28/08/2008, 08:01

Las capas no admiten los eventos onfocus ni onblur (lo opuesto a onfocus) a menos que sean de contenido editable. Si ese es el caso, podés usar algo como esto:

Código PHP:

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
<title>Documento sin t&iacute;tulo</title> 
<script> 
window.onload=function(){ 
document.getElementById('pp').contentEditable="true"; 
} 
</script> 
</head> 
 
<body><div id="pp" style="border:1px solid #000" onblur="alert('desenfocada')">test</div> 
</body> 
</html>

xinxan22 · #3 (**permalink**) 29/08/2008, 01:58

Cuando dices lo de contenido editable a que te refieres? lo que hay dentro de la etiqueta div es un <ifram> el cual cargo otra página .

Panino5001 · #4 (**permalink**) 29/08/2008, 05:37

Con contenido editable me refiero a esto:

Código PHP:

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
<script>
window.onload=function(){
    if(document.getElementById('pp').contentEditable){
    //firefox 3, explorer, safari, ópera
    document.getElementById('pp').contentEditable='true'
    }else{//firefox 2
        var ifr=document.createElement('iframe');
        var old=document.getElementById('pp');
        ifr.id='pp';
        ifr.frameBorder='0';
        ifr.height='20';
        ifr.width='100%';
        ifr.onload=function(){
        var doc=ifr.contentWindow.document || ifr.contentDocument;
        doc.body.innerHTML=old.innerHTML;
        doc.documentElement.style.margin=doc.body.style.margin=0;
        doc.designMode="on";
        }
        old.parentNode.replaceChild(ifr,old);

    }
    
} 
</script>
</head>

<body>
<div id="pp">Acá se puede escribir, igual que en el otro ejemplo que te mostré antes</div>
</body>
</html>