4

Tenho uma página onde ocorre uma task qualquer, só que é necessário finalizar ela, ou todo processo será perdido. Gostaria de mostrar um alert, como o Facebook e outros sites mostram, perguntando ao usuário se deseja sair mesmo dessa página ou permanecer nela.

3
  • 1
    O facebook, como exemplo, apenas emite o alerta quando o usuário escreve algo nos comentários ou no status e não postou. Isso é para evitar fechar a janela por acidente e perder o que escreveu. É sob esse contexto que vc quer ou é algo geral, independente da situação? 16/09/2015 às 18:39
  • Exato, nesse contexto mesmo. 16/09/2015 às 18:40
  • É possível fazer isso pro f5?
    – Dr.G
    23/02/2018 às 2:48

3 Respostas 3

5

Use o window.onbeforeunload

Html:

<textarea id="comentario"></textarea>

<a href="">Sair da página</a>

Javascript:

window.onbeforeunload = confirmExit;
function confirmExit()
{
    if(document.getElementById("comentario").value != ""){
        return "Deseja realmente sair desta página?";
    }
}

Link do exemplo funcionando: JsFiddle

6
  • +1, mas com este código ele dá o alert mesmo quando é clicado no botão pra enviar o formulário... acho que o ap vai ter o mesmo problema... tem como colocar esta exceção?
    – gustavox
    16/09/2015 às 19:51
  • 1
    Você precisa só adaptar a sua lógica dentro da função, esse é apenas um exemplo, vou editar e adicionar um exemplo. 16/09/2015 às 21:00
  • 1
    é a tal lógica que falta... do que jeito que postou é como uma resposta incompleta. Não está errado, mas está incompleto pois há um contexto específico. 16/09/2015 às 21:02
  • 1
    Fiz a edição, apenas coloque o campo mudando o ID 16/09/2015 às 21:07
  • Obrigado amigo! 17/09/2015 às 1:06
2

Sob o contexto de que o alerta deve ser exibido caso o usuário tenha um campo preenchido, segue abaixo um exemplo funcional com JQuery:

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript">

$(window).bind("beforeunload", function() { 
    console.log("length", $("#foo").val().length);
    if ($("#foo").val().length > 0)
        return "Do you really want to close?";
})
</script>
</head>
<body>

<input id="foo" type="text" value="" size="50" />

</body>
</html>

A pergunta não especifica o não uso de bibliotecas, por isso utilizei JQuery.

0

Coloque esse script na sua página e teste:

   <script language="JavaScript">
  window.onbeforeunload = confirmExit;
  function confirmExit()
  {
    return "Se você fechar o navegador, seus dados serão perdidos. Desena Realmente sair?";
  }
</script>

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .