Comment utiliser JavaScript pour afficher un message lorsqu'un nombre donné est dans une plage ?-js tutoriel-php.cn

Comment utiliser JavaScript pour afficher un message lorsqu'un nombre donné est dans une plage ?

WBOY

Libérer： 2023-09-06 23:09:08

avant

945 Les gens l'ont consulté

如何使用 JavaScript 在给定数字在范围内时显示消息？

Dans cet article, nous vérifierons si un nombre se situe dans une certaine plage et afficherons un message en fonction du résultat obtenu. Cette fonctionnalité de JavaScript vous permet d'effectuer une validation numérique lors de la création d'un formulaire ou de tout autre document.

Syntaxe

Voici la syntaxe pour vérifier si un numéro est dans la plage et afficher un message -

if (isNaN(number) || number < lower || number > upper){
   document.getElementById("output").innerHTML = number + " is not in range";
} else {
   document.getElementById("output").innerHTML = number + " is in range";
}

Copier après la connexion

Ici numéro est le numéro saisi pour vérifier s'il est dans la plage. Lower et Upper sont les limites inférieure et supérieure de la plage.

Algorithme

Étape 1 - Utilisez la méthode prompt() pour saisir des nombres.
Étape 2 − Vérifiez trois conditions, premièrement si c'est NaN, deuxièmement si c'est NaN si le nombre est inférieur à la limite inférieure de la plage, et troisièmement si le nombre est supérieur à la limite supérieure de la plage. gamme.
Étape 3 - Si l'une des trois conditions ci-dessus est vraie, affichez un message indiquant que le numéro n'est pas à portée, sinon affichez un message indiquant que le numéro est à portée.

Exemple< /h2>

Dans l'exemple ci-dessous, nous vérifions si le nombre saisi est compris entre 1 et 10 et affichons un message.

<!DOCTYPE html>
<html>
<body>
   <div>
   <h3>Display Message if number is in Range</h3>
   <p>Click the below button to enter number.</p>
   <button onclick="display()"> click me</button>
   <p id="output"></p>
   </div>
   <script>
      function display() {
         const number = prompt(&#39;Please enter a number:&#39;);
         if (isNaN(number) || number < 1 || number > 10)
            document.getElementById("output").innerHTML = number + " is not in range";
         else
            document.getElementById("output").innerHTML = number + " is in range";
      }
   </script>
</body>
</html>

Copier après la connexion

Comme indiqué dans la fenêtre de sortie, après avoir cliqué sur le bouton "Cliquez sur moi", la fenêtre vous demandera de saisir un numéro.

Après avoir entré le numéro dans la zone d'invite, vous saurez s'il se situe dans la plage indiquée.

Essayez de saisir différents nombres pour vérifier si le nombre est compris entre 1 et 10. Comme le montre l'exemple, si nous saisissons un nombre compris entre 1 et 10, le résultat est vrai. L'exemple ci-dessus vérifie 3 conditions : premièrement, le nombre n'est pas nul, deuxièmement, il n'est pas inférieur à 1 et troisièmement, il est supérieur à 10.

Exemple

Nous pouvons également écrire le code ci-dessus comme indiqué ci-dessous et il donnera également le même résultat

<!DOCTYPE html>
<html>
<body>
   <div>
   <h3>Display Message if number is in Range</h3>
   <p>Click the below button to enter number.</p>
   <button onclick="display()"> click me
   </button>
   <p id="message"></p>
   </div>
   <script>
      function display() {
         const number = prompt(&#39;Please enter a number:&#39;);
         if (number >= 1 && number <= 10)
            document.getElementById("message").innerHTML = number + " is in range";
         else
            document.getElementById("message").innerHTML = number + " is not in range";
      }
   </script>
</body>
</html>

Copier après la connexion

NOTE- Nous pouvons utiliser cette fonctionnalité pour effectuer une validation sur le formulaire, comme si nous voulons obtenir d'un élément donné Sélectionnez la date de naissance dans les données ou validez lorsque l'option est donnée pour sélectionner n'importe quelle réponse entière de 0 à 9.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!