Méthodes de window : boîtes de dialogue

Contents

window.alert()

La méthode window.alert nous permet l'affichage d'une boîte d'alerte dont le texte est paramétrable. Nous ne pouvons cependant modifier l'aspect de cette boîte, ni modifier le texte de l'unique bouton (OK) qui permet la fermeture de la boîte.

Associée au manipulateur d'évènement, cette boîte permet un affichage dynamique en réaction aux actions du visiteur, ou à l'ouverture/fermeture d'une page.

  1. alert ("Ceci est un message d'alerte.");

Remarques sur alert()

  • Il n'est pas nécessaire de préciser la référence complète window.alert(), alert() étant suffisant.
  • Afin de réaliser des boîtes de dialogues comportant plusieurs lignes, nous devons insérer les caractères \n pour signaler que la chaîne de caractère comprend une nouvelle ligne (comme en langage C).
  • Ces remarques sont valables pour les trois boîtes de dialogue (alert, confirm, et prompt.).

window.confirm()

Cette méthode nous permet l'affichage d'une boîte semblable à alert, mais deux boutons (OK et CANCEL) nous permettent de solliciter un choix de la part du visiteur.

  1. confirm ("Etes vous sûr de vouloir aller vers la page de test ?");

La méthode renvoie une valeur de type booléen, ce qui nous permet d'utiliser cette valeur dans une structure de contrôle if (condition){instructions;} où condition est remplacé par la méthode confirm().

  1. if (confirm("Etes vous sûr de vouloir aller vers la page d'accueil ?")){
  2. 	location.href = "https://www.gaudry.be/en/infobrol.html";
  3. }

window.prompt()

La méthode window.prompt() provoque aussi l'affichage d'un texte que nous pouvons définir, et de deux boutons (OK et CANCEL), mais propose en plus un champ texte afin que l'utilisateur puisse introduire une réponse.

Deux paramètres sont donc nécessaires:

  1. Le message à afficher.
  2. La réponse par défaut (si aucune valeur par défaut n'est nécessaire, une chaîne vide figure le deuxième paramètre.).

Valeur retournée par la méthode:

  • null si le visiteur presse le bouton cancel (la valeur null est considérée comme false dans une structure de contrôle).
  • Valeur de chaîne égale à l'entrée saisie dans le champ texte si le visiteur presse le bouton ok après avoir rempli le champ.
  • false si le visiteur presse le bouton ok sans introduire une chaîne de caractère dans le champ.
  1. var answer = prompt('Veuillez introduire votre nom :','');
  2. while(!answer){
  3. 	answer = prompt('Ce n\'est quand même pas si compliqué d\'introduire votre nom... Enfin rentrez n\'importe quoi :','');
  4. }
  5. alert ('Bravo ' + answer + '!');

En JavaScript, les chaînes de caractères sont délimitées soit par des guillemets ("), soit par des apostrophes ('), alors que dans d'autres langages seulement les guillemets sont autorisés (les apostrophes entourent alors un simple caractère). Nous pouvons voir dans ce dernier exemple que comme nous utilisons les apostrophes, nous devons faire précéder les vraies apostrophes du texte par le caractère d'échappement, le backslash (\).

Exemples d'alertes JavaScript

Le script provoque l'affichage de diverses boîtes d'alerte, mais que se passe-t-il réellement ?

Définition de la fonction

Selon la définition de la fonction test, trois valeurs (arguments) sont demandés en entrée :

  • a
  • b
  • c

Ensuite, l'exécution de la fonction provoque l'affichage d'une boîte d'alerte (alerte 1) avec l'argument a.
Lorsque cette boîte est fermée par l'utilisateur, une seconde boîte d'alerte (alerte 2) est affichée avec l'argument b.

Appels à la fonction

Le premier appel à la fonction test renvoie les trois chaînes de caractères avec les valeurs suivantes :

  • "paramètre 1"
  • "paramètre 2"
  • "paramètre 3"

Donc :

  • alerte 1 est affiché avec paramètre 1.
  • ensuite alerte 2 est affiché avec paramètre 2.
  • il n'est pas fait appel à l'argument c qui contient paramètre 3, mais l'argument est transmis même si la fonction ne le traite pas.

Le deuxième appel à la fonction test renvoie les trois chaînes de caractères avec les valeurs suivantes:

  • "paramètre 4"
  • "paramètre 5"
  • "paramètre 6"

Donc :

  • alerte 1 est affiché avec paramètre 4.
  • ensuite alerte 2 est affiché avec paramètre 5.

English translation

You have asked to visit this site in English. For now, only the interface is translated, but not all the content yet.

If you want to help me in translations, your contribution is welcome. All you need to do is register on the site, and send me a message asking me to add you to the group of translators, which will give you the opportunity to translate the pages you want. A link at the bottom of each translated page indicates that you are the translator, and has a link to your profile.

Thank you in advance.

Document created the 19/03/2002, last modified the 02/11/2018
Source of the printed document:https://www.gaudry.be/en/javascript-alert.html

The infobrol is a personal site whose content is my sole responsibility. The text is available under CreativeCommons license (BY-NC-SA). More info on the terms of use and the author.