Saltar al contenido

Evite los bloqueadores de ventanas emergentes del navegador

Revisamos profundamente cada sección de nuestro espacio con la meta de mostrarte siempre información certera y actualizada.

Solución:

La regla general es que los bloqueadores de ventanas emergentes se activarán si window.open o similar se invoca desde javascript que no es invocado por acción directa del usuario. Es decir, puedes llamar window.open en respuesta a un clic de botón sin ser golpeado por el bloqueador de ventanas emergentes, pero si coloca el mismo código en un evento de temporizador, se bloqueará. La profundidad de la cadena de llamadas también es un factor: algunos navegadores más antiguos solo miran a la persona que llama inmediatamente, los navegadores más nuevos pueden retroceder un poco para ver si la persona que llamó fue un clic del mouse, etc. Manténgalo lo más superficial posible para evitar los bloqueadores de ventanas emergentes.

Basado en el consejo muy útil de Jason Sebring, y en las cosas cubiertas aquí y allá, encontré una solución perfecta para mi caso:

Pseudocódigo con fragmentos de Javascript:

  1. crear inmediatamente una ventana emergente en blanco en la acción del usuario

     var importantStuff = window.open('', '_blank');
    

    (Enriquecer la llamada a window.open con las opciones adicionales que necesite).

    Opcional: agregue algún mensaje de información “en espera”. Ejemplos:

    a) Una página HTML externa: reemplace la línea anterior con

     var importantStuff = window.open('http://example.com/waiting.html', '_blank');
    

    b) Texto: agregue la siguiente línea debajo de la anterior:

     importantStuff.document.write('Loading preview...');
    
  2. llénelo con contenido cuando esté listo (cuando se devuelva la llamada AJAX, por ejemplo)

     importantStuff.location.href = 'https://example.com/finally.html';
    

    Alternativamente, puede cerrar la ventana aquí si no la necesita después de todo (if ajax request failspor ejemplo, gracias a @Goose por el comentario):

     importantStuff.close();
    

De hecho, uso esta solución para una redirección de correo electrónico y funciona en todos mis navegadores (Windows 7, Android). Él _blank bit ayuda a que la redirección mailto funcione en dispositivos móviles, por cierto.

Como buena práctica, creo que es una buena idea prueba si se bloqueó una ventana emergente y tome medidas en caso de que lo haga. Debe saber que window.open tiene un valor de retorno, y ese valor puede ser null si la acción falla. Por ejemplo, en el siguiente código:

function pop(url,w,h) 
    n=window.open(url,'_blank','toolbar=0,location=0,directories=0,status=1,menubar=0,titlebar=0,scrollbars=1,resizable=1,width='+w+',height='+h);
    if(n==null) 
        return true;
    
    return false;

si la ventana emergente está bloqueada, window.open volverá null. Entonces la función regresará false.

Como ejemplo, imagina llamar a esta función directamente desde cualquier enlace con target="_blank": si la ventana emergente se abre con éxito, regresa
false bloqueará la acción del enlace, de lo contrario, si la ventana emergente está bloqueada, regresará true permitirá el comportamiento predeterminado (abrir una nueva ventana en blanco) y continuar.


De esta manera, tendrá una ventana emergente si funciona y una ventana en blanco si no.

Si la ventana emergente no se abre, puede:

  • abra una ventana en blanco como en el ejemplo y continúe
  • abrir una ventana emergente falsa (un iframe dentro de la página)
  • informar al usuario (“permita ventanas emergentes para este sitio”)
  • abra una ventana en blanco y luego informe al usuario, etc.

Nos puedes secundar nuestro ensayo escribiendo un comentario o dejando una puntuación te damos las gracias.

¡Haz clic para puntuar esta entrada!
(Votos: 5 Promedio: 4.6)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *