วิธากำหนดขอบเขตค่าช่องกรอกข้อมูลใน HTML

บทนำ

ใช้แอตทริบิวต์ min และ max กับ <input type="number"> เพื่อจำกัดค่าต่ำสุดและสูงสุดที่กรอกได้

ตัวอย่างโค้ด

<!DOCTYPE html>
<html>
  <head>
    <title>HTML Input Number Range</title>
  </head>
  <body>
    <form action="" method="get">
      กรอกตัวเลข 1 ถึง 10: <br>
      <input type="number" name="num" min="1" max="10"><br>
      <input type="submit" value="Submit">
    </form>
  </body>
</html>

Input Types ที่รองรับ min/max

• number
• range
• date, datetime-local, month, week, time

แอตทริบิวต์เสริม

• step - กำหนดช่วงขั้น (เช่น step="5" จะได้ 0, 5, 10, 15...)
• value - ค่าเริ่มต้น