วิธาใช้ Input Type Time ใน HTML

บทนำ

ใช้ <input type="time"> สำหรับให้ผู้ใช้เลือกเวลา จะแสดง Time Picker พอคลิก

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

<!DOCTYPE html>
<html>
  <head>
    <title>HTML Input Time</title>
  </head>
  <body>
    <form action="" method="get">
      รายละเอียด:<br><br>
      ชื่อนักเรียน<br>
      <input type="text" name="sname"><br>
      เวลาสอบ<br>
      <input type="time" name="etime"><br>
      <input type="submit" value="Submit">
    </form>
  </body>
</html>

รูปแบบค่า

• รูปแบบ 24 ชั่วโมง: HH:MM (เช่น 13:30)
• รองรับวินาที: HH:MM:SS (เช่น 13:30:45)
• ค่าที่ส่งไปเซิร์ฟเวอร์เป็นสตริงในรูปแบบนี้

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

• min - เวลาต่ำสุด (เช่น "08:00")
• max - เวลาสูงสุด (เช่น "18:00")
• step - ช่วงนาที (default 60 วินาที, step="900" = 15 นาที)
• readonly, disabled, required

การรองรับเบราว์เซอร์

รองรับใน Chrome, Edge, Safari, Opera ไม่รองรับใน Firefox และ IE (ต้องใช้ Polyfill หรือ JavaScript Date Picker แทน)