表单

表单元素

>

表单元素的一般语法:

1.

2. 特殊的

选项的文本

...

值

表单元素

1. 用来填的

text : 单行文本框

password : 密码框

textarea : 多行文本框

email : 邮件地址输入框

url : 网址输入框

number : 数字输入框

属性:

size可以控制宽度

maxlength可以控制最大输入的字符数

max(最大值), min(最小值)对number，range有效

2. 用来选的

checkbox : 复选框

radio : 单选框

select : 下拉列表框

属性:

checked用于默认选中radio和checkbox

selected用于默认选中select中的option选项

value用于设置元素的值

3. 用来点的

submit : 提交按钮

reset : 重置按钮

button : 一般按钮, 没有功能

image : 图片按钮, 功能上等同于submit

4. 其它的

file : 文件域, 用于文件上传

hidden : 隐藏域, 作用不明

range：滑块

设置表单要注意的地方

1. 一组radio应该设置相同的name, 这样才能"互斥"

2. 除按钮外, 其它表单元素都应该设置name属性

3. 用于选择的元素都应该设置value

表单元素的只读和禁用

readonly

disabled

使用label提高用户体验

label称为"标注", 可以扩大表单元素的可操作区域, 点击label就等价于点击了对应的表单元素.

方式一:

文本

方式二:

文本

使用HTML5内置的表单验证

1. 用户提示

2. 用required实现必填验证

3. 用pattern实现复杂的文本信息验证(正则表达式)

//必须由4-9位字母组成

//必须是13xxxxxxxxx或15xxxxxxxxx