Si necesitamos cargar un valor numérico podemos emplear un input con el siguiente formato:
<input type="number" id="valor" name="valor" min="1" max="10">
Las propiedades min y max definen el valor máximo y mínimo que se puede ingresar.
Ingresar por teclado un valor numérico comprendido entre 1 y 10.
<!DOCTYPE HTML> <html> <head> <title>Título de la página</title> <meta charset="UTF-8"> </head> <body> <form action="#"> <p>Ingrese un valor entre 1 y 10: <input type="number" id="valor" name="valor" min="1" max="10"> </p> <p><input type="submit" value="Confirmar"></p> </form> </body> </html>
Cuando ejecutamos esta página en Chrome aparece un selector numérico con dos botones que podemos incrementar o disminuir el valor:
La misma funcionalidad esta implementada en Firefox. Microsoft Edge no lo implementa a enero de 2018.