Les boîtes de dialogue en Javascript
Les boîtes de dialogue en Javascript
-
Objectifs
- Savoir afficher du texte et des messages.
- Savoir la notion d’une méthode.
-
Définitions
- Une boîte de dialogue est une fenêtre qui s’affiche au premier plan suite à un événement, et qui permet
- Soit d’avertir l’utilisateur
- Soit le confronter à un choix
- Soit lui demander de compléter un champ pour récupérer une information
- JavaScript propose des boîtes de dialogue par défaut qui permettent d’interagir avec l’utilisateur.
- il en existe 3 types.
- Les alert() qui permettent d’afficher un message.
- Les confirm() qui permettent de récupérer une valeur booléenne.
- Les prompt() qui permettent de récupérer une valeur textuelle.
-
La méthode alert()
- La boîte de dialogue alert() permet d’afficher un texte et un bouton « OK ».
- alert() est une méthode de l’objet Window.
- alert() est une instruction simple, appelée fonction, qui permet d’afficher une boîte de dialogue contenant un message.
- Le message de cette méthode est placé entre apostrophes (« »), elles-mêmes placées entre les parenthèses de la fonction alert().
-
La méthode Confirm()
- La boîte de dialogue confirm() permet d’afficher un message et deux boutons : un bouton « OK » et un bouton « Annuler ». Cette fonction retourne une valeur booléenne qui vaut « true » si c’est le bouton OK qui est cliqué et retourne « false » si c’est le bouton « Annuler » qui est cliqué.
- Lorsque l’utilisateur appuie sur « OK » la méthode renvoie la valeur true. Elle renvoie false dans le cas contraire…Elle admet comme alert() un seul paramètre: une chaîne de caractères…
-
La méthode prompt()
- La boîte de dialogue prompt() permet d’afficher un message, un champ à remplir (imput de type texte) et un bouton « OK ». Cette fonction retourne la valeur qui a été entré dans le champ par l’utilisateur.
- On peut aussi se servir de la fonction prompt() pour un calcul :
Exemple:
<!DOCTYPE html >
<html lang="fr">
<head>
<title>Exemple1</title>
<meta ="UTF-8">
<script language=”javascript”>
function msg(){
alert(“Attention!”);}
</script>
</head>
<body>
<center><b><u>La méthode Alert()</u></b></center><br>
<form name= ”f1”>
<input type=”button” value=”Cliquer ici !!! ” onclick=“msg()“ >
</form>
</body>
</html> if ( confirm( "Message à afficher" ) ) {
// Code à exécuter si le l'utilisateur clique sur "OK"
} else {
// Code à exécuter si l'utilisateur clique sur "Annuler"
}Syntaxe
String window.prompt(String message[, String defaut])Exemple:
<script>
var userName = prompt('Entrez votre prénom :');
alert(userName); // Affiche le prénom entré par l'utilisateur
</script>
<script>
var first, second, result;
first = prompt('Entrez le premier chiffre :');
second = prompt('Entrez le second chiffre :');
result = parseInt(first) + parseInt(second); /* la fonction parseInt()
transforme la chaîne de caractères en nombre */
alert(result);
</script>