新闻动态
HTML5中的数字类型的输入框:数字选择器
http://sytm.net 发布日期:2014/4/4 14:29:19

要求用户输入数字要比输入Email地址或者网址的情况麻烦得多。比如,是要求用户输入具体的-1呢?还是1~10范围内的数字,是要求 输入7呢?还是小数又或者是圆周率、、、怎么样,也许你已经感觉到麻烦了吧?

实际上,大多数情况下都是要求用户输入一定范围内的某个数字--比如:十进制的整数或者是10的倍数。HTML5标准中就定义了这样的类型的输入框,如下所示:

<input type="number"

min="0"

max="10"

step="2"

value="6">

让我们来依次看下该input元素中的属性

type="number",表示这是个数字类型的输入框。

min="0",表示输入的数字不能小于0

max="10",表示输入的数字不能大于10

step="2",结合min的值,定义了选择范围在0、2、4、、、、一直到最大值。

value="6",表示默认值是6,和一般输入框的value属性是一样,这点旨在告诉大家HTML5标准的制定也是基于早期的HTML标准的。因此,它完全兼容早期HTML标准中定义的内容。

这就是数字类型输入框。要记住的是:所有的属性都是可选的。如果要求用户输入的数字区间有下限但没有上限,那就可以只设置min属性,而不设置max属性;step属性默认值为1,因此如果不想改变这个默认值的话就直接忽略该属性;value属性没有默认值,该属性值可以为空或者可以忽略。


更多阅读
返回列表
© 2010 TianMei Technology All rights reserved. ICP:辽B-2-4-20100065辽公网安备 21010202000010号  网站地图