Comme nous utiliserons le navigateur comme environnement de démonstration, voyons quelques fonctions pour interagir avec l'utilisateur : alert , prompt et confirm .
Celui-ci, nous l'avons déjà vu. Il affiche un message et attend que l'utilisateur appuie sur « OK ».
Par exemple:
alerte("Bonjour");La mini-fenêtre contenant le message est appelée fenêtre modale . Le mot « modal » signifie que le visiteur ne peut pas interagir avec le reste de la page, appuyer sur d'autres boutons, etc. tant qu'il n'a pas utilisé la fenêtre. Dans ce cas – jusqu’à ce qu’ils appuient sur « OK ».
L' prompt de fonction accepte deux arguments :
result = prompt(titre, [par défaut]);
Il affiche une fenêtre modale avec un message texte, un champ de saisie pour le visiteur et les boutons OK/Annuler.
title
Le texte à montrer au visiteur.
default
Un deuxième paramètre facultatif, la valeur initiale du champ de saisie.
Les crochets dans la syntaxe [...]
Les crochets autour de default dans la syntaxe ci-dessus indiquent que le paramètre est facultatif et non obligatoire.
Le visiteur peut taper quelque chose dans le champ de saisie rapide et appuyer sur OK. Ensuite, nous obtenons ce texte dans le result . Ou ils peuvent annuler la saisie en appuyant sur Annuler ou en appuyant sur la touche Échap , nous obtenons alors null comme result .
L'appel à prompt renvoie le texte du champ de saisie ou null si la saisie a été annulée.
Par exemple:
let age = prompt('Quel âge as-tu ?', 100);
alert(`Vous avez ${age} ans !`); // Tu as 100 ans ! Dans IE : fournissez toujours une default
Le deuxième paramètre est facultatif, mais si nous ne le fournissons pas, Internet Explorer insérera le texte "undefined" dans l'invite.
Exécutez ce code dans Internet Explorer pour voir :
let test = prompt("Test");Ainsi, pour que les invites s'affichent correctement dans IE, nous vous recommandons de toujours fournir le deuxième argument :
let test = prompt("Test", ''); // <-- pour IELa syntaxe :
résultat = confirmer (question);
La fonction confirm affiche une fenêtre modale avec une question et deux boutons : OK et Annuler.
Le résultat est true si OK est enfoncé et false sinon.
Par exemple:
let isBoss = confirm("Etes-vous le patron ?");
alert( estBoss ); // vrai si OK est enfoncéNous avons couvert 3 fonctions spécifiques au navigateur pour interagir avec les visiteurs :
alert
affiche un message.
prompt
affiche un message demandant à l'utilisateur de saisir du texte. Il renvoie le texte ou, si vous cliquez sur le bouton Annuler ou sur Échap , null .
confirm
affiche un message et attend que l'utilisateur appuie sur « OK » ou « Annuler ». Il renvoie true pour OK et false pour Cancel/ Esc .
Toutes ces méthodes sont modales : elles suspendent l'exécution du script et ne permettent pas au visiteur d'interagir avec le reste de la page tant que la fenêtre n'a pas été fermée.
Il existe deux limitations communes à toutes les méthodes ci-dessus :
L'emplacement exact de la fenêtre modale est déterminé par le navigateur. Habituellement, c'est au centre.
L'apparence exacte de la fenêtre dépend également du navigateur. Nous ne pouvons pas le modifier.
C'est le prix de la simplicité. Il existe d'autres moyens d'afficher des fenêtres plus belles et une interaction plus riche avec le visiteur, mais si les « cloches et sifflets » n'ont pas beaucoup d'importance, ces méthodes fonctionnent très bien.
importance : 4
Créez une page Web qui demande un nom et l'affiche.
Exécutez la démo
Code JavaScript :
let name = prompt("Quel est votre nom ?", "");
alerte(nom);La page complète :
<!DOCTYPEhtml>
<html>
<corps>
<script>
« utiliser strict » ;
let name = prompt("Quel est votre nom ?", "");
alerte(nom);
</script>
</corps>
</html>