本文翻译自：
Is there a float input type in HTML5?
According to
html5.org
, the “number” input type’s “value attribute, if specified and not empty, must have a value that is a valid floating point number.”
根据
html5.org的说法
，“数字”输入类型的“值属性，如果指定且不为空，则必须具有一个有效浮点数的值”。
Yet it is simply (in the latest version of Chrome, anyway), an “updown” control with integers, not floats:
但这只是简单的（无论如何，在最新版的Chrome中），是带有整数而不是浮点数的“上下”控件：
<input type="number" id="totalAmt"></input>
Is there a floating point input element native to HTML5, or a way to make the number input type work with floats, not ints?
是否有HTML5固有的浮点输入元素，或使数字输入类型适用于浮点而不是整数的方法？
Or must I resort to a jQuery UI plugin?
还是我必须诉诸jQuery UI插件？
#1楼
参考：
https://stackoom.com/question/1Hlqv/HTML-中是否有浮点输入类型
#2楼
The
number
type has a
step
value controlling which numbers are valid (along with
max
and
min
), which defaults to
1
.
number
类型具有一个
step
值，用于控制哪些数字有效（以及
max
和
min
），默认值为
1
。
This value is also used by implementations for the stepper buttons (ie pressing up increases by
step
).
此值也被实现用于步进按钮（即，按
step
增加）。
Simply change this value to whatever is appropriate.
只需将此值更改为适当的值即可。
For money, two decimal places are probably expected:
为了赚钱，可能期望两位小数：
<input type="number" step="0.01">
(I’d also set
min=0
if it can only be positive)
（如果它只能是正数，我还将设置
min=0
）
If you’d prefer to allow any number of decimal places, you can use
step="any"
(though for currencies, I’d recommend sticking to
0.01
).
如果您希望允许任意数量的小数位数，则可以使用
step="any"
（尽管对于货币而言，我建议坚持
0.01
）。
In Chrome & Firefox, the stepper buttons will increment / decrement by 1 when using
any
.
在铬和Firefox，步进按钮将增量/减量被1时使用
any
。
(thanks to Michal Stefanow’s answer for pointing out
any
, and
see the relevant spec here
)
（感谢Michal Stefanow指出了
any
的答案，并
在此处查看相关规范
）
Here’s a playground showing how various steps affect various input types:
这是一个游乐场，显示了各个步骤如何影响各种输入类型：
<form> <input type=number step=1 /> Step 1 (default)<br /> <input type=number step=0.01 /> Step 0.01<br /> <input type=number step=any /> Step any<br /> <input type=range step=20 /> Step 20<br /> <input type=datetime-local step=60 /> Step 60 (default)<br /> <input type=datetime-local step=1 /> Step 1<br /> <input type=datetime-local step=any /> Step any<br /> <input type=datetime-local step=0.001 /> Step 0.001<br /> <input type=datetime-local step=3600 /> Step 3600 (1 hour)<br /> <input type=datetime-local step=86400 /> Step 86400 (1 day)<br /> <input type=datetime-local step=70 /> Step 70 (1 min, 10 sec)<br /> </form>
As usual, I’ll add a quick note: remember that client-side validation is just a convenience to the user.
像往常一样，我将简要说明一下：请记住，客户端验证对用户来说只是一种便利。
You must also validate on the server-side!
您还必须在服务器端进行验证！
#3楼
Via:
http://blog.isotoma.com/2012/03/html5-input-typenumber-and-decimalsfloats-in-chrome/
通过：
http
:
//blog.isotoma.com/2012/03/html5-input-typenumber-and-decimalsfloats-in-chrome/
But what if you want all the numbers to be valid, integers and decimals alike?
但是，如果您希望所有数字都是有效的（整数和小数都一样），该怎么办？
In this case, set step to “any”
在这种情况下，将步骤设置为“任意”
<input type="number" step="any" />
Works for me in Chrome, not tested in other browsers.
在Chrome浏览器中对我有效，未经其他浏览器测试。
#4楼
I just had the same problem, and I could fix it by just putting a
comma
and not a
period
/
full stop
in the number because of
French localization
.
我也遇到了同样的问题，由于
法国本地化
，我可以用
逗号
而不是
句号
/
句号
来解决问题。
So it works with:
因此它适用于：
2 is OK
2还可以
2,5 is OK
2,5还可以
2.5 is KO (The number is considered “illegal” and you receive empty value).
2.5是KO（数字被视为“非法”，并且您收到空值）。
#5楼
您可以使用：
<input type="number" step="any" min="0" max="100" value="22.33">
#6楼
<input type="text" id="sno" placeholder="Only float with dot !"
onkeypress="return (event.charCode >= 48 && event.charCode <= 57) ||
event.charCode == 46 || event.charCode == 0 ">
Meaning :
含义：
Char code :
字符代码：
-
48-57 equal to
0, 1, 2, 3, 4, 5, 6, 7, 8, 9
48-57等于
0, 1, 2, 3, 4, 5, 6, 7, 8, 9
-
0 is
Backspace
(otherwise need refresh page on Firefox)
0是
Backspace
（否则需要Firefox上的刷新页面）
-
46 is
dot
46是
dot
&&
is
AND
,
||
&&
是
AND
，
||
is
OR
operator.
是
OR
运算符。
if you try float with comma :
如果您尝试使用逗号浮动：
<input type="text" id="sno" placeholder="Only float with comma !"
onkeypress="return (event.charCode >= 48 && event.charCode <= 57) ||
event.charCode == 44 || event.charCode == 0 ">
Supported Chromium and Firefox (Linux X64)
(other browsers I does not exist.)
支持的Chromium和Firefox（Linux X64）
（我不存在其他浏览器。）