He visto que en páginas de publicidad se puede preguntar al usuario, cuando cierra la pestaña, si confirma el cierre de la pestaña o si desea seguir en la página. El mensaje es un alert con dos botones: seguir aquí
y salir
.
¿Cómo hago eso? Es que no lo encuentro.
Muchas gracias.
3 respuestas
A mi me funciona con este código. Funciona tanto para cerrar la página como para cambiar hacia otra.
<script language="JavaScript">
window.onbeforeunload = preguntarAntesDeSalir;
function preguntarAntesDeSalir(){
return "¿Seguro que quieres salir?";
}
</script>
Puedes usar el evento window.onbeforeunload
para detectar cuando se cierra la ventana
jQuery & Javascript – Capture the Browser or Tab Closed Event
Cómo detectar el cierre o la salida de una página Web
basicamente seria
<script language="JavaScript" type="text/javascript">
window.onbeforeunload = function preguntarAntesDeSalir()
{
return "¿Seguro que quieres salir?";
}
</script>
La opción más fácil de confirmación es simplemente ingresar el método confirm
. El cual muestra una caja de dialogo con un mensaje y dos botones: Aceptar y Cancelar. Si el usuario presiona Aceptar, el resultado es verdadero, de otra manera sería falso.
var r = confirm("¡Presiona un botón!");
if (r == true) {
alert("Presionaste aceptar");
} else {
alert("Presionaste cancelar");
}
Por desgracia, no hay ningún soporte de navegadores (al menos que yo sepa) para la apertura de un diálogo de confirmación que no es la predeterminada de aceptar/cancelar. Las únicas maneras para poner otro texto en los botones sería utilizar un framework como jQuery UI y su dialogo de confirmación o creandolo uno desde cero.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>jQuery UI Dialog - Modal confirmation</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
<script>
$( function() {
$( "#dialog-confirm" ).dialog({
resizable: false,
height: "auto",
width: 400,
modal: true,
buttons: {
"Borrar todo": function() {
alert("Borraste todo");
},
"Cancelar": function() {
alert("No se borro nada");
}
}
});
} );
</script>
</head>
<body>
<div id="dialog-confirm" title="¿Vaciar la papeleria de reciclaje?">
<p><span class="ui-icon ui-icon-alert" style="float:left; margin:12px 12px 20px 0;"></span>Estos artículos serán borrados para siempre y no podrán ser recuperados. ¿Estás seguro?</p>
</div>
</body>
</html>
-
Si me van a calificar negativo, estaría bien saber porque.– HooseCommented el 18 ago. 2016 a las 18:04