HTML表单的用法

一、表单简介

form 元素定义 HTML 表单,HTML 表单用于收集用户输入。
其它表单元素应被<form>元素包裹,以便将用户输入集中发送给服务器。
form有两个重要属性:action 属性定义在提交表单时执行的动作,method 属性规定在提交表单时所用的 HTTP 方法。

二、常用表单元素

1、<input> 元素是最重要的表单元素,<input> 元素有很多形态:

input标签 作用
<input type="text"> 定义文本的单行字段输入
<input type="password"> 定义密码字段
<input type="number"> 用于应该包含数字值的输入字段
<input type="radio"> 定义单选按钮
<input type="checkbox"> 定义复选框
<input type="submit"> 定义提交表单数据至表单处理程序的按钮
<input type="button> 定义按钮
<input type="date"> 用于应该包含日期的输入字段

2、
<textarea> 元素定义多行输入字段(文本域);
<select> 元素定义下拉列表,<option> 元素定义待选择的选项;
<button> 元素定义可点击的按钮,在form中默认属性type="submit"定义提交表单数据至表单处理程序的按钮;
3、<datalist> 元素为 <input> 元素规定预定义选项列表。
4、<fieldset> 元素组合表单中的相关数据,<legend> 元素为 <fieldset> 元素定义标题。

三、HTML为input新增的一些属性

1、autocomplete 属性规定表单或输入字段是否应该自动完成。
当自动完成开启,浏览器会基于用户之前的输入值自动填写值。
2、novalidate 属性属于 <form> 属性。
如果设置,则 novalidate 规定在提交表单时不对表单数据进行验证。
3、autofocus 属性是布尔属性。
如果设置,则规定当页面加载时 <input> 元素应该自动获得焦点。
4、form 属性规定 <input> 元素所属的一个或多个表单。
如需引用一个以上的表单,请使用空格分隔的表单 id 列表。
5、placeholder 属性规定用以描述输入字段预期值的提示(样本值或有关格式的简短描述)。该提示会在用户输入值之前显示在输入字段中,在输入后即消失。placeholder 属性适用于以下输入类型:text、search、url、tel、email 以及 password。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 一、表单 1. 表单的作用 HTML 表单用于接收不同类型的用户输入,用户提交表单时向服务器传输数据,从而实现用户...
    zx9426阅读 564评论 0 1
  • 什么是form表单 表单在网页中主要负责数据采集功能,把用户填写的信息提交到网站的后台服务器。 form标签的常用...
    ezrealor阅读 359评论 0 0
  • HTML 表单用于搜集不同类型的用户输入。 元素定义 HTML 表单,相当于表单的外壳,用于把用户输入的不同类型...
    lingfighting阅读 533评论 0 1
  • 1、关于form表单的基础 form表单:是一个包含表单元素的区域;作用,用于包裹表单元素。 表单元素:是允许用户...
    tangmengyun阅读 791评论 1 1
  • 可怜天下父母心!
    崔廷伟阅读 733评论 0 0

友情链接更多精彩内容