HTML的表单使用小结

2019-11-06  本文已影响0人  橙赎

一、表单

表单元素的格式 表单的语法

二,常用表单元素

1.文本框(text)

可用于输入用户名等用途。

文本框的基本格式

2.密码框(password)

用于输入密码,输入的内容会变成小圆点。

密码框的基本格式

3.单选按钮(radio)

性别选择等可以用到单选按钮。

单选按钮的用法(checked表示默认)

4.复选框(checkbox)

用于多项选择。

.复选框的用法(checked表示默认)

5.下拉列表(select和option)

下拉列表的具体应用 下拉列表的用法

6.按钮(submit,reset,image)

表示提交、重置、图片按钮 具体实现

7.邮箱(email)

会自动验证Email地址格式是否正确。

邮箱输入

8.网址(url)

会自动验证Url地址格式是否正确。

网址的用法

9.数字(number)

min:最小数字。max:最大数字。step:数字间隔。

数字的用法

10.滑块(range)

min:滑动的最小数字。max:滑动的最大数字。step:一次能滑多少数字。

滑块的用法

11.搜索框(search)

搜索功能的输入框。

搜索框

三、表单的高级应用

1.表单的隐藏域(hidden)

定义:隐藏域是用来收集或发送信息的不可见元素,对于网页的访问者来说,隐藏域是看不见的。

作用:当表单被提交时,隐藏域就会将信息用你设置时定义的名称和值发送到服务器上。    

隐藏域的用法

2.只读(readonly)和禁用(disabled)

只读:要求某些数据可见但不能进行修改。

禁用:当使用者满足某个条件后才能使用,如只有同意注册协议后用户才能点击注册按钮。

只读和禁用的用法

3.表单元素的标注(label)

label标签的for属性对应的id与表单元素id一致,而id属性是给label标签和表单元素进行关联使用的。

label的用法

四、表单的初级验证

1.文本输入框内容提示(placeholder)

描述文本框引导用户该输入什么内容。

placeholder的用法

2.必填项(required)

规定文本框填写内容不能为空,否则不允许用户提交表单。    

required的用法

3.正则表达式(pattern)

用户输入的内容必须符合正则表达式所指的规则,否则就不能提交表单。

输入手机号的正则表达式
上一篇 下一篇

猜你喜欢

热点阅读