Janela de Diálogo (Pop-up) do JavaScript

No JavaScript, você pode criar diálogos ou janelas emergentes para interagir com o usuário.

JavaScript possui três tipos diferentes de janelas emergentes: caixa de alerta, caixa de confirmação e caixa de diálogo.

Caixa de alerta

A caixa de alerta é a mais simples das janelas emergentes. Ela permite que você mostre uma mensagem curta ao usuário.

Ela também inclui um botão "Confirmar", que o usuário deve clicar para continuar.

Sintaxe:

window.alert("msg")

window.alert();O método pode não ter o prefixo "window." e pode ser usado diretamente:

alert("Hello world!");

Caixa de confirmação

Se você quiser que o usuário verifique ou aceite algum conteúdo, geralmente é usado uma caixa de confirmação.

A caixa de confirmação parece semelhante à caixa de alerta, mas inclui botões "Cancelar" e "Confirmar".

Se o usuário clicar em "Confirmar", a caixa retornarátrueSe o usuário clicar em "Cancelar", a caixa retornaráfalse。

Sintaxe:

window.confirm("msg")

window.confirm();O método pode não ter o prefixo "window." e pode ser usado diretamente:

var r = confirm("Pressione um botão!");
if (r == true) {
　　　txt = "Você pressionou Confirmar!";
}
　　　txt = "Você pressionou Cancelar!";
}

Caixa de diálogo

Se você quiser que o usuário insira um valor antes de entrar na página, geralmente é usado uma caixa de diálogo.

A caixa de diálogo inclui um campo de entrada de texto, botões "Confirmar" e "Cancelar".

Se o usuário clicar em "Confirmar", a caixa retornará o valor de entrada. Se o usuário clicar em "Cancelar", a caixa retornará null.

Sintaxe:

window.prompt("msg", "defaultText")

window.prompt()O método pode não ter o prefixo "window." e pode ser usado diretamente:

var name = prompt("Por favor, insira seu nome", "Someone");
if (name != null) {
　　　document.getElementById("output").innerHTML = "Hello "　+　name;
}

Notas:prompt()O valor retornado pelo método sempre é uma string. Isso significa que se o usuário inserir15Se retornar uma string 15”em vez de número15。

Portanto, se você precisar usar o valor retornado como um número, é necessário convertê-lo, consulteComo converter tipos de dados em JavaScript。

Exibir quebras de linha na caixa de diálogo

Para exibir quebras de linha em uma caixa de diálogo, use quebra de linha ou quebra de linha (\n); um backslash seguido do caractere n.

alert("Hello\nHow are you?");

Mais exemplos

Este exemplo demonstra os diferentes tipos de caixas de diálogo suportados pelo JavaScript: