Computer >> Hướng Dẫn Máy Tính >  >> Lập Trình >> HTML

Cách chỉ định bước nhảy số hợp lệ (step) cho input number trong HTML?

Thuộc tính step trên <input type="number">, range, date, time, datetime-local, month, week chỉ định khoảng cách giữa các giá trị hợp lệ. Mặc định: 1 (số), 60 (giây cho time), 1 (ngày cho date).

Ví dụ

<!DOCTYPE html>
<html>
  <head>
    <title>Thuộc tính step HTML</title>
  </head>
  <body>
    <form action="" method="get">
      Điểm (bước 5): <input type="number" name="points" step="5" min="0" max="100"><br>
      <input type="submit" value="Gửi">
    </form>
  </body>
</html>

Kết hợp min, max, step

<input type="number" min="0" max="100" step="5">
<!-- Giá trị hợp lệ: 0, 5, 10, 15... 100 -->

<input type="time" step="900">
<!-- Bước 15 phút (900 giây) -->

<input type="range" min="0" max="1" step="0.1">
<!-- 0, 0.1, 0.2... 1 -->

Lưu ý

  • step="any": Cho phép bất kỳ giá trị nào (bỏ qua bước nhảy).
  • Validation: trình duyệt chặn submit nếu giá trị không khớp step (từ min).
  • UI spinner (mũi tên lên/xuống) tăng/giảm theo step.
  • Float precision: tránh step như 0.1 (lỗi floating point) — nhân 10 dùng integer.