美文网首页
HTML的表单使用小结

HTML的表单使用小结

作者: 橙赎 | 来源:发表于2019-11-06 19:39 被阅读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)

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

输入手机号的正则表达式

相关文章

  • HTML的表单使用小结

    一、表单 二,常用表单元素 1.文本框(text) 可用于输入用户名等用途。 2.密码框(password) 用于...

  • HTML表单用法

    HTML表单 HTML 表单用于搜集不同类型的用户输入。 表单是一个包含表单元素的区域。 使用 定义表单 .for...

  • 如何使用HTML表单

    什么是HTML表单 HTML表单用于收集用户输入,想服务器传输数据,使用 元素来定义一个HTML表单。表单可以包含...

  • HTML表单 -- 如何使用HTML表单

    HTML 表单用于收集用户输入,向服务器传输数据,使用 元素来定义一个HTML表单。表单可以包含 input, l...

  • html 表单内容小结

    form表单有什么作用?有哪些常用的input 标签,分别有什么作用? 表单标签 功能:用于申明表单,定义采集数...

  • 4. 表单

    4.1 HTML表单 先看一个简单的HTML表单 4.2 使用Flask-wtf处理表单 Flask-wtf默认为...

  • HTML 表单的用法

    HTML 表单用于搜集不同类型的用户输入。HTML表单是用户交互中非常强大的工具。使用 元素来定义一个HTML表单...

  • HTML表单的使用方法

    1.HTML表单简介 HTML表单是一个包含表单元素的区域,用来收集用户输入的内容并提交。表单使用标签 来设置 标...

  • 11、Struts2 的文件上传和下载

    文件上传 表单准备要想使用 HTML 表单上传一个或多个文件须把 HTML 表单的 enctype 属性设置为 m...

  • HTML 表格表单详解

    HTML表单详解 网站怎样与用户进行交互?答案是使用HTML表单(form)。表单是可以把浏览者输入的数据传送到服...

网友评论

      本文标题:HTML的表单使用小结

      本文链接:https://www.haomeiwen.com/subject/llqpbctx.html