2012-06-18 34 views
7

Tengo una serie de páginas que abre ventanas emergentes (nuevas pestañas en Mobile Safari). Cada una de estas ventanas emergentes necesita saber cuándo están enfocadas o no. En los escritorios, usamos window.onblur y window.onfocus para controlar este comportamiento. Sin embargo, ninguno de estos eventos funciona en iPad. También probé window.onpageshow y window.onpagehide que tampoco parecen disparar en el momento adecuado. Tengo un archivo HTML de prueba:Detectar el movimiento a una nueva pestaña en Mobile Safari

<html> 
<head> 
<script language="javascript"> 
console.log('Hello'); 
window.onblur = function(e) { console.log('blur'); }; 
window.onfocus = function(e) { console.log('focus'); }; 
window.onpagehide = function(e) { console.log('pagehide'); }; 
window.onpageshow = function(e) { console.log('pageshow'); }; 
</script> 
</head> 
<body> 
<a href="http://www.google.com" target="_blank">Click Me</a> 
</body> 
</html> 

En teoría, al hacer clic en 'Click Me', que debería recibir un evento de desenfoque cuando aparezca la nueva ventana. Pero esto no ocurre en Mobile Safari. onpagehide y onpageshow tampoco muestran amor, solo ayudan a detectar cuándo está a punto de cerrar la pestaña.

¿Cómo puedo obtener el comportamiento que estoy buscando en Mobile Safari? ¿Es posible?

Respuesta

4

No creo que onblur se pueden detectar, pero esto es un código para detectar onfocus:

var timestamp=new Date().getTime(); 
function checkResume() 
{ 
    var current=new Date().getTime(); 
    if(current-timestamp>5000) 
    { 
     var event=document.createEvent("Events"); 
     event.initEvent("focus",true,true); 
     document.dispatchEvent(event); 
    } 
    timestamp=current; 
} 
window.setInterval(checkResume,50); 

A continuación, que acaba de escribir:

document.addEventListener("focus",function() 
{ 
    alert("Focus detected"); 
},false); 
5

Prueba esto: https://gist.github.com/1122546

Es un poliol de Visibilty API. Debería hacer el truco.

+0

¡Gracias, parece el boleto! –

+0

en realidad de acuerdo con el comentario de Chris Keele, que puede no funcionar en Mobile Safari. No tengo mi iPad ahora mismo, si lo que dice es cierto, ¿hay alguna forma de evitarlo? –

+6

De hecho, ** no ** funciona en iOS. – arik

0

Alguien ha preguntado lo mismo un poco más recientemente, así que simplemente vincularé esta respuesta con la anterior here.

El método de Mageek es muy similar a lo que estoy haciendo, pero también se activará en un evento de desplazamiento o cuando el teclado esté visible. Prevenir el comportamiento al desplazarse no fue un gran desafío, pero nunca llegué a buscar eventos de teclado en la pantalla.

Mi objeto también aprovecha requestAnimationFrame y utilizará el hack de enfoque solo como una alternativa, optando por utilizar Visibility API cuando esté disponible (idealmente haciéndolo a prueba de futuro).

+0

esto solo dirá cuando vuelvas a la pestaña, ¿verdad? Me gustaría saber cuándo la pestaña que tiene este código ya no está en la pantalla, y saberlo antes de que se haya vuelto a abrir la pestaña. –

Cuestiones relacionadas