HTML <input> type=”number”

The <input> tag with a type="number" attribute creates a numeric input field.

A spinner allows the user to increment and decrement by a predefined value.

An <input> element of type number.
Click the spinner to increment or decrement the number input value.

Quantity (0 – 100, increments of 5)

<form action="/tutorial/action.html">
  <fieldset>
    <legend>Quantity (0 - 100, increments of 5)</legend>

    <input type="number" name="number"
           min = "0" max="100" step="5" value="30"><br /><br />

    <input type="submit" value="Submit">
  </fieldset>
</form>

Using nput type=”number”

#

The <input type="number"> specifies a number input.

A number input only accepts numberic values.

When focused the field shows a spinner that increases or decreases the value by a given step size.

The following attributes specify number input restrictions:

• max – maximum value allowed
• min – minimum value allowed
• step – numeric interval size
• value – initial value

<input type="number">

Browser support

#

Here is when type="number" support started for each browser:

Chrome

6.0
Sep 2010

Firefox

29.0
Apr 2014

IE/Edge

10.0
Sept 2012

Opera

10.0
Aug 2009

Safari

5.0
Sep 2010

You may also like

#

 Back to <

input

>