-
Javascript - Fundamentos Básicos
-
Lecture 1Javascript Tutorial
-
Lecture 2Javascript – Introdução
-
Lecture 3JavaScript – Sintaxe
-
Lecture 4Javascript – Habilitando JavaScript em navegadores
-
Lecture 5Javascript – Onde colocá-lo no HTML
-
Lecture 6Javascript – Variáveis
-
Lecture 7Javascript – Aprendendo Operadores
-
Lecture 8JavaScript – Aprendendo declaração if … else.
-
Lecture 9Javascript -Aprendendo Switch Case
-
Lecture 10Javascript – Aprendendo While Loops
-
Lecture 11JavaScript – Aprendendo Loop For
-
Lecture 12Javascript – Aprendendo loop for…in
-
Lecture 13Javascript – Aprendendo controle de loop
-
Lecture 14Javascript – Aprendendo Funções
-
Lecture 15JavaScript – Arrays
-
Lecture 16Javascript – Aprendendo Eventos
-
Lecture 17Javascript – Aprendendo Sobre Cookies
-
Lecture 18Javascript – Redirecionamento de página
-
Lecture 19Javascript – Caixas de diálogo
-
Lecture 20Javascript – Aprendendo Void Keyword
-
Lecture 21JavaScript – Aprendendo a imprimir uma página
-
Javascript – Caixas de diálogo
JavaScript oferece suporte a três tipos importantes de caixas de diálogo. Essas caixas de diálogo podem ser usadas para levantar e alertar, ou para obter confirmação sobre qualquer entrada ou para ter um tipo de entrada dos usuários. Aqui, discutiremos cada caixa de diálogo uma por uma.
Caixa de Diálogo de Alerta
Uma caixa de diálogo de alerta é usada principalmente para dar uma mensagem de aviso aos usuários. Por exemplo, se um campo de entrada exige a inserção de algum texto, mas o usuário não fornece nenhuma entrada, então, como parte da validação, você pode usar uma caixa de alerta para fornecer uma mensagem de aviso.
No entanto, uma caixa de alerta ainda pode ser usada para mensagens mais amigáveis. A caixa de alerta fornece apenas um botão “OK” para selecionar e prosseguir.
Exemplo
<html> <head> <script type = "text/javascript"> <!-- function Warn() { alert ("This is a warning message!"); document.write ("This is a warning message!"); } //--> </script> </head> <body> <p>Click the following button to see the result: </p> <form> <input type = "button" value = "Click Me" onclick = "Warn();" /> </form> </body> </html>
Caixa de Diálogo de Confirmação
Uma caixa de diálogo de confirmação é usada principalmente para obter o consentimento do usuário sobre qualquer opção. Ele exibe uma caixa de diálogo com dois botões: OK e Cancelar.
Se o usuário clicar no botão OK, o método da janela confirm () retornará verdadeiro. Se o usuário clicar no botão Cancelar, confirm () retornará falso. Você pode usar uma caixa de diálogo de confirmação da seguinte maneira.
Exemplo
<html> <head> <script type = "text/javascript"> <!-- function getConfirmation() { var retVal = confirm("Do you want to continue ?"); if( retVal == true ) { document.write ("User wants to continue!"); return true; } else { document.write ("User does not want to continue!"); return false; } } //--> </script> </head> <body> <p>Click the following button to see the result: </p> <form> <input type = "button" value = "Click Me" onclick = "getConfirmation();" /> </form> </body> </html>
Caixa de Diálogo Prompt
A caixa de diálogo de prompt é muito útil quando você deseja exibir uma caixa de texto pop-up para obter a entrada do usuário. Assim, permite que você interaja com o usuário. O usuário precisa preencher o campo e clicar em OK.
Esta caixa de diálogo é exibida usando um método chamado prompt () que tem dois parâmetros: (i) um rótulo que você deseja exibir na caixa de texto e (ii) uma string padrão para exibir na caixa de texto.
Esta caixa de diálogo possui dois botões: OK e Cancelar. Se o usuário clicar no botão OK, o prompt do método da janela () retornará o valor inserido na caixa de texto. Se o usuário clicar no botão Cancelar, o método de janela prompt () retornará nulo.
Exemplo
O exemplo a seguir mostra como usar uma caixa de diálogo de prompt:
See the Pen
Javascript – Prompt Dialog Box by John Pires (@johnpiresBR)
on CodePen.