- <input type ="number">元素可以帮助您在构建用户界面和将数字输入到表单中的逻辑时简化你的工作。 当你使用正确的 type 值 "number" 创建数字输入时,会自动验证你输入的文本是否为数字,通常是一组向上和向下按钮。
- 浏览器可能会选择提供步进箭头,让用户可以使用鼠标增加和减少输入的值,或者只需用指尖敲击即可。
属性 |
说明 |
value |
填写到输入框中的数值文字的Number表示。你可以通过把一个数字放在value 属性中来设置输入框的默认值 |
示例
<!DOCTYPE html> <html lang="en">
<head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head>
<body> <form> <label for="ticketNum">Number of tickets you would like to buy:</label> <br> <input id="ticketNum" type="number" name="ticketNum" value="0"> <br> <input type="number" placeholder="Multiple of 10"> </form> </body>
</html> |
浏览器运行结果如下:
来自 <https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/Input/number>