Iniciar sesiónCerrar
Correo:
Contraseña:
Entrar
Recordar sesión en este navegador
Iniciar sesiónIniciar sesiónCrear cuentaCrear cuenta
LWP » Foros » JavaScript » Problemas con windows.onblur

JavaScript - Problemas con windows.onblur

Volver
Nuevo Tema
<<>>
 
Vista:
sin imagen de perfil

Problemas con windows.onblur

Publicado por Katy (10 intervenciones) el 19/10/2022 01:03:37
He creado un modulo para ejecutarse cuando el usuario trate de cambiar de ventana o de ficha en el navegador.
Usé windows.onblur e intente tambien con document.visibilityChange
El modulo muestra usa confirm para solictar confirmacion de la decision de salir de la pagina, en tal caso la cierra pero sin no se confirma deseo que vuelva.
Quiero que se ejecute antes de que llegue a la otra ventana o ficha, pero se ejecuta solo cuando vuelvo a la ventana, es decir, llega a la otra ventana o ficha y solo al retornar a la ventana me aparecen los mensajes. Luego no cumple la funcion que quiero que es evitar el cambio de ventana.
Me explico, la solicitud de confirmacion me aparece al volver a la pagina, no al salir. Y si ya salio y volvio, ya no tendria sentido.
Alguien me puyede ayudar?
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de Gio
Val: 368
Bronce
Ha aumentado 1 puesto en JavaScript (en relación al último mes)
Gráfica de JavaScript

Problemas con windows.onblur

Publicado por Gio (79 intervenciones) el 20/10/2022 16:31:50
Hola Katy, ¿Quieres evitar que el usuario cambie de ventana o pestaña del navegador? ¿Podrías enviar un código de lo que llevas hecho, resumido donde se muestre lo que quieres hacer?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

Problemas con windows.onblur

Publicado por Katy (10 intervenciones) el 21/10/2022 16:50:25
Gracias Gio.
Este es el codigo que hice:

<!DOCTYPE html>
<html>
<head>
<h3>Pagina de prueba</h3><br>
</head>
<body>
Introduzca un dato: <input type="text" name="Dato" id="TxtDato"><br><br>
<textarea id="Salida" rows="10" cols="70"></textarea>
<script type="text/javascript">
//Crea variables globales
estadoPg='';
ventanaActiva='';
msg='';

//Recarga la ventana
if (navigator=="Safari") {
msg+='Navegador safari/n'
Salida.value+=msg;
window.location.reload()
}
else Salida.value+=document.location+'\n';

//Crea propiedad a window
window.Activa=true;

//Si se deja de ver la ventana o pestaña
document.addEventListener("visibilitychange", () => solicitaConfirmacion())


//Determinar si se esta tratando de abrir otra ventana con la misma instancia
//window.addEventListener("load", () => verificaSiExiste(this))

// Cuando el usuario intenta cambiar de ventana
window.addEventListener("blur", () => solicitaConfirmacion(this))

//Cuando el usuario cambia de pestaña
document.addEventListener("blur", () => solicitaConfirmacion(this))

//Confirma decision del Usuario
function solicitaConfirmacion(Ventana){
msg+='Solicita confirmar salida\n';
if (Ventana.Activa) {
Ventana.Activa=false;
if (confirm('Esta ABANDONANDO su Examen. Está seguro que desea salir de su Examen?\nSi esta seguro, haga cilck en Aceptar y su Examen se ENVIARÁ INMEDIATAMENTE.\nSi no, haga click en Cancelar para VOLVER a su Examen.')) {
msg+='Solicita confirmar decision de salir\n';
if (confirm('CONFIRMA que desea SALIR Y ENVIAR su Examen?\nSi CONFIRMA, haga cilck en Aceptar.\nSi NO, haga click en Cancelar.'))
Ventana.Salida.value+=msg;
else
volverAlExamen(Ventana);
}
else
volverAlExamen(Ventana);
}
}

//Accion que se toma si el Usuario Cancela y decide Volver a la Ventana
function volverAlExamen(Ventana) {
msg+='Vuelve a la ventana\n';
Ventana.focus();
Ventana.location.reload();
Ventana.document.location.reload();
Ventana.Activa=true;
Ventana.Salida.value+=msg;
}

//Verifica si ya existe la página
function verificaSiExiste(Ventana) {
msg+='Se esta cargando la pagina\n';
ventanaActiva=Ventana.location;
if (estadoPg === '') {
// Carga si no tiene el estado.
msg+='Carga la pagina '+estadoPg+'\n';
estadoPg='Cargada'; //Cambia el estado
}
else{
Ventana.close;
msg+='Cierra la ventana creada\n';
}
Ventana.Salida.value+=msg;
}

</script>
</body>
</html>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Gio
Val: 368
Bronce
Ha aumentado 1 puesto en JavaScript (en relación al último mes)
Gráfica de JavaScript

Problemas con windows.onblur

Publicado por Gio (79 intervenciones) el 22/10/2022 01:39:25
Debes trabajar con el siguiente código para detectar cuando el usuario cambia de pestaña o de programa:

1
2
3
4
5
6
7
8
var unaVez = true;
setInterval(()=>{
    if (unaVez && !document.hasFocus()) {
        unaVez = false;
        //TU CODIGO VA AQUI
    } else
        unaVez = true;
}, 200);


Retoqué todo el código, quedando así:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
<!DOCTYPE html>
<html>
 
<head>
    <h3>Pagina de prueba</h3><br>
</head>
 
<body>
    Introduzca un dato: <input type="text" name="Dato" id="TxtDato"><br><br>
    <textarea id="Salida" rows="10" cols="70"></textarea>
 
 
    <script type="text/javascript">
        var ventanaActiva = true;
 
        //Navegador
        function navegador() {
            var ua= navigator.userAgent, tem,
            M= ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [];
            if(/trident/i.test(M[1])){
                tem=  /\brv[ :]+(\d+)/g.exec(ua) || [];
                return 'IE '+(tem[1] || '');
            }
            if(M[1]=== 'Chrome'){
                tem= ua.match(/\b(OPR|Edg)\/(\d+)/);
                if(tem!= null) return tem.slice(1).join(' ').replace('OPR', 'Opera');
            }
            M= M[2]? [M[1], M[2]]: [navigator.appName, navigator.appVersion, '-?'];
            if((tem= ua.match(/version\/(\d+)/i))!= null) M.splice(1, 1, tem[1]);
            return M[0];
        }
 
        Salida.value += `Navegador ${navegador()}\n`;
        Salida.value += document.location + '\n';
 
        //Funcion que se ejecutará cuando el usuario salga del sitio web
        function fueraDeFoco() {
            Salida.value += 'Solicita confirmar decision de salir\n';
 
            setTimeout(() => {
                if (confirm('Esta ABANDONANDO su Examen. Está seguro que desea salir de su Examen?\nSi esta seguro, haga cilck en Aceptar y su Examen se ENVIARÁ INMEDIATAMENTE.\nSi no, haga click en Cancelar para VOLVER a su Examen.')) {
                    setTimeout(() => {
                        if (confirm('CONFIRMA que desea SALIR Y ENVIAR su Examen?\nSi CONFIRMA, haga cilck en Aceptar.\nSi NO, haga click en Cancelar.')) {
                            //EL CODIGO PARA ENVIAR EL EXAMEN VA AQUI
                            window.location.reload();
                            window.document.location.reload();
                        } else
                            ventanaActiva = true;
                    }, 1);
                } else
                    ventanaActiva = true;
            }, 1);
        }
 
        //Visibilidad del navegador
        setInterval(()=>{
            if (ventanaActiva && !document.hasFocus()) {
                ventanaActiva = false;
                fueraDeFoco();
            }
        }, 200);
    </script>
</body>
 
</html>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

Problemas con windows.onblur

Publicado por Katy (10 intervenciones) el 27/10/2022 02:12:16
Gracias Gio, probe lo que me siugeriste y te comento que en Chrome esta capturando el foco antes de cambiar de ventana y si hace lo que se espera que haga, sin embargo al cambiar de ficha en la misma ventana del navegador, solo se ejecuta al retornar a la ficha, es decir se llega a cambiar de ficha y solo aparece el cuadro de diálogo de confirmación al retornar a la ficha.
En Firefox y Safari sigue cambiando de ventana y de nuevo el cuadro de diálogo de confiormación al volver a la ventana, lo mismo ocurre al cambiar de ficha.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar