Antes de falarmos sobre como exibir uma mensagem e depois redirecionar o usuário para outra página, vamos falar um pouco sobre as propriedades window.location e window.location.href.
Existem duas formas de fazer o redirecionamento:
window.location = "//www.devmedia.com.br/";
window.location.href = "//www.devmedia.com.br/";
Você já deve ter notado que usando qualquer um dos dois métodos o efeito é o mesmo. Isso acontece por que os objetos têm métodos que são padrão, nesse caso, se você omitir o .href, o navegador entenderá que você está se referindo ao método window.location.href.
Agora vamos mostrar como exibir um alert e redirecionar o usuário. O JavaScript é executado pelos navegadores linha por linha, ou seja, para conseguir esse efeito de redirecionamento basta você digitar um alert e em seguida alterar a propriedade window.location. Como na Listagem 1.
<html>
<head>
<title>window.location</title>
<script type="text/javascript">
alert("Você será redirecionado");
window.location="//www.devmedia.com.br/";
</script>
</head>
<body>
</body>
</html>
Na Listagem 2 vamos agora mostrar um exemplo de como exibir uma mensagem e redirecionar ao clicar em um botão.
<html>
<head>
<title>window.location ao clicar em um botão</title>
<script type="text/javascript">
function redirecionar(){
alert("Você será redirecionado");
window.location="//www.devmedia.com.br/";
}
</script>
</head>
<body>
<button onclick="redirecionar();">Clique aqui</button>
</body>
</html>
Na Listagem 2 criei um button e coloquei no evento onclick uma função que exibe uma mensagem e redireciona para a página da DevMedia
Por fim, na Listagem 3 vamos criar um evento de confirmação onde será exibida uma mensagem questionando se o usuário deseja que a página seja redirecionada, caso o usuário confirme, será levado à página da DevMedia.
<html>
<head>
<title>window.location que exibe uma confirmação ao clicar em um botão</title>
<script type="text/javascript">
function redirecionar(){
if(confirm("Deseja ser redirecionado?")){
window.location="//www.devmedia.com.br/";
}
}
</script>
</head>
<body>
<button onclick="redirecionar();">Clique aqui</button>
</body>
</html>
Como vimos, é bastante simples exibir uma mensagem informativa ou de confirmação antes de redirecionar o usuário para outra página. No caso mais simples, basta adicionar o comando de redirecionamento após o alert, pois a execução linear do código garantirá que o endereço será alterado logo após o fechamento da caixa de diálogo.