根据html5.org,“number”输入类型的“value属性,如果指定且不为空,必须有一个有效浮点数的值。”
然而,它只是一个带有整数的“上下”控件(至少在最新版本的Chrome中),而不是浮动:
<输入类型=“数字” id=“totalAmt”></input>
是否有一个原生的HTML5浮点输入元素,或一种方法,使数字输入类型与浮点,而不是整数工作?或者我必须求助于jQuery UI插件?
根据html5.org,“number”输入类型的“value属性,如果指定且不为空,必须有一个有效浮点数的值。”
然而,它只是一个带有整数的“上下”控件(至少在最新版本的Chrome中),而不是浮动:
<输入类型=“数字” id=“totalAmt”></input>
是否有一个原生的HTML5浮点输入元素,或一种方法,使数字输入类型与浮点,而不是整数工作?或者我必须求助于jQuery UI插件?
当前回答
<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>
其他回答
你可以将step属性用于输入类型number:
<input type="number" id="totalAmt" step="0.1"></input>
Step ="any"将允许任何小数。 Step ="1"不允许小数。 Step ="0.5"允许为0.5;1;1.5;... Step ="0.1"允许为0.1;0.2;0.3;0.4;...
基于这个答案
<input type="text" id="sno" placeholder="Only float with dot !"
onkeypress="return (event.charCode >= 48 && event.charCode <= 57) ||
event.charCode == 46 || event.charCode == 0 ">
意义:
字符代码:
48-57等于0 1 2 3 4 5 6 7 8 9 0表示退格(否则需要在Firefox上刷新页面) 46是点
&&是AND, ||是OR运算符。
如果你尝试使用float和逗号:
<input type="text" id="sno" placeholder="Only float with comma !"
onkeypress="return (event.charCode >= 48 && event.charCode <= 57) ||
event.charCode == 44 || event.charCode == 0 ">
支持Chromium和Firefox (Linux X64)(其他浏览器I不存在)。
你可以使用:
<input type="number" step="any" min="0" max="100" value="22.33">
<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>
在我的IPad上使用React, type="number"并不完全适合我。 对于范围在99.99999 - .00000之间的浮点数,我使用正则表达式(^[0-9]{0,2}$)|(^[0-9]{0,2}\.[0-9]{0,5}$)。第一组(…)对于所有没有浮点数的正两位数(例如23)都是正确的,|或例如。12345对于第二组(…)。您可以将其用于任何正浮点数,只需分别更改范围{0,2}或{0,5}即可。
<input
className="center-align"
type="text"
pattern="(^[0-9]{0,2}$)|(^[0-9]{0,2}\.[0-9]{0,5}$)"
step="any"
maxlength="7"
validate="true"
/>