欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

html5的一些表单属性_html/css_WEB-ITnose

程序员文章站 2022-06-05 21:50:43
...
IE8及以下不能很好支持这些属性


input属性:
placeholder:输入框的默认值,向用户显示描述性说明文字或者提示信息

autocomplete:值为on和off。。on则代表当该字段填写并提交后再返回该页,再输入时会显示以前输入的。off则是关闭,包含用户输入数据的安全。默认为on
autofocus:页面载入时设置某个input自动获取焦点,注意该页面只能设置一个input的这个属性,设置多个相当于没有设置。
list特性和datalist:通过list为某个输入框增加下拉列表。。相当于js实现的“自动完成”功能,但是不能进行模糊查询
如果datalist内有2项值:"a34343"和"并24234",用户希望的是输入了3后这2个值都出现,但实际上一个也不出现。
它要求是完全匹配,比如输入a,则下拉a34343出现,接着输入4,那么这个下拉值也就没有了。

required:表单提交前该元素必须填写,即不能为空。不建议使用,因为提示信息‘请填写此字段’,除非有属性可以代替该提示信息。
pattern:给input标签内写正则的地方。。type为email或url的输入控件内置相关正则表达式,如果value不符合其正则表达式,那表单将通不过验证,无法提交。。
不建议给type为email或url的元素使用,因为提示信息固定,正则固定。。还不如js直接重写。

一些输入设置:
rangeUnderflow 限制数值控件的最小值 设置min, input type="number" min="0" value="20"
rangeOverflow 限制数值控件的最大值 设置max,input type="number" max="100" value="20"
stepMismatch 确保输入值符合min,max,step的设置 设置max min step, input type="number" min="0" max="100" step="10" value="20"

 1  2  3  4  5  6  7 
8 List特性和datalist:
9 10 11 12 13 14 15 16 17
18
19 url:
20 user:
21 pwd:
22 27 28 29 30
31 正则:32 33 邮箱:
34 地址:35 DATE:
36 TIME:37 MONTH:38 周:39 数字:
40 滑动条41 搜索 :42 颜色:
43 44 45 46 47
48 自动填充表单
49 50 51 52 53 54 55
56 57 58 59 输出表单output60
61 62 63 64
65

  1 

number特性

2 3 4 5 6 7 8 9 10 11
12

List特性和datalist:

13 14 15 16 17 18 19 20

datalist

21
22 23 24 25 26 27 28
29
30 31

表单

32
33 url:
34 user:
35 pwd:
36 41 42 43 正则: 44 45 邮箱:
46 地址: 47 DATE:
48 TIME: 49 MONTH: 50 周: 51 数字:
52 滑动条 53 搜索 : 54 颜色:
55 56 57 58
59

自动填充表单

60 61 62 63 64 65 66
67 68 69 70

output

71
72 73 74 75
76
77 78 79
80 0 81 82 100+ 83 84 = 85 86
87
88 89

progress

90 91 85% 92 93
94 95

time

96 发布日期: 97 更新日期: 98
99 100

ruby

101 102 漢103 这里是注释104 汉(这里是不支持时显示)105 106
107 108

wbr软换行

109

如果想学习 AJAX, 那么必须熟悉 XMLHttpRequest 对象。

110
111 112

canvas

113 114 122
123 124

conmmand

125 126 127 Click Me!128 129
130 131

details

132
133 MacBook Pro Specification134
    135
  • A
  • 136
  • B
  • 137
  • C
  • 138
  • D
  • 139
  • E
  • 140
141
142
143 144 145

keygen

146
147 Username:148 151 152 153
154 155 156

menu

157 158
  • Red
  • 159
  • Blue
  • 160