Avez-vous une question? (216) 97 656 803 hajjriadh@gmail.com
JavaScript

Les boîtes de dialogue en Javascript

Un cours complet pour maîtriser Les boîtes de dialogue en Javascript.

0 chapitres 0 QCM Accès gratuit
  1. Objectifs

    • Savoir afficher du texte et des messages.
    • Savoir la notion d’une méthode.
  2. 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.
  3. 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().
    • 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> 
  4. 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...
    if ( confirm( "Message à afficher" ) ) {
        // Code à exécuter si le l'utilisateur clique sur "OK"
    } else {
        // Code à exécuter si l'utilisateur clique sur "Annuler" 
    }
  5. 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.
    • 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>
    
  6. On peut aussi se servir de la fonction prompt() pour un calcul :
  7. <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>