Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk menggunakan JavaScript untuk memaparkan mesej apabila nombor tertentu berada dalam julat?

Bagaimana untuk menggunakan JavaScript untuk memaparkan mesej apabila nombor tertentu berada dalam julat?

WBOY
WBOYke hadapan
2023-09-06 23:09:08870semak imbas

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

Dalam artikel ini, kami akan menyemak sama ada nombor berada dalam julat tertentu dan memaparkan mesej berdasarkan output yang terhasil. Ciri JavaScript ini membolehkan anda melakukan pengesahan berangka semasa membuat borang atau sebarang dokumen lain.

Syntax

Berikut ialah sintaks untuk menyemak sama ada nombor berada dalam julat dan memaparkan mesej -

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";
}

Di sini nombor ialah nombor yang dimasukkan untuk menyemak sama ada ia berada dalam julat. bawah dan atas ialah had bawah dan atas julat.

Algoritma

  • Langkah 1 − Gunakan kaedah prompt() untuk memasukkan nombor.

  • Langkah 2 − Semak tiga syarat, pertama jika NaN, kedua jika NaN jika nombornya kurang daripada had bawah julat, dan ketiga jika nombor lebih besar daripada had atas julat julat.

  • Langkah 3 - Jika mana-mana daripada tiga syarat di atas adalah benar, maka paparkan mesej yang menyatakan bahawa nombor itu tidak berada dalam julat, jika tidak paparkan mesej yang menyatakan bahawa nombor itu berada dalam julat.

Contoh

Dalam contoh di bawah, kami menyemak sama ada nombor yang dimasukkan berada dalam julat 1 hingga 10 dan memaparkan mesej.

<!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>

Seperti yang ditunjukkan dalam tetingkap output, selepas mengklik butang "klik saya", tetingkap akan meminta anda memasukkan nombor.

Selepas memasukkan nombor dalam kotak gesaan, anda akan tahu sama ada ia berada dalam julat yang diberikan.

Cuba masukkan nombor yang berbeza untuk menyemak sama ada nombor itu berada dalam julat 1 hingga 10. Seperti yang ditunjukkan dalam contoh, jika kita memasukkan sebarang nombor antara 1 dan 10, outputnya adalah benar. Contoh di atas menyemak 3 syarat, pertama, nombornya tidak batal, kedua, tidak kurang daripada 1, dan ketiga, lebih besar daripada 10.

Contoh

Kita juga boleh menulis kod di atas seperti yang ditunjukkan di bawah dan ia juga akan memberikan output yang sama

<!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>

NOTA- Kita boleh menggunakan ciri ini untuk melakukan pengesahan pada borang seperti jika kita ingin mendapatkan daripada yang diberikan Pilih tarikh lahir dalam data atau sahkan apabila diberi pilihan untuk memilih mana-mana jawapan integer dari 0 hingga 9.

Atas ialah kandungan terperinci Bagaimana untuk menggunakan JavaScript untuk memaparkan mesej apabila nombor tertentu berada dalam julat?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Artikel ini dikembalikan pada:tutorialspoint.com. Jika ada pelanggaran, sila hubungi admin@php.cn Padam