使用HTML创建表单

<form></form>标记被用于定义表单域，即创建一个表单。action、method、name为表单标记<form>的常用属性。

action属性用于指定接收并处理表单数据的服务程序的。

method属性用于设置表单数据的提交方式，其取值为get或post。

name属性用于指定表单的名称，以区分一个页面中的多个表单。

autocomplete属性用于指定是否自动完成功能。“自动完成”是指表单控件输入的内容记录下来，当再次输入时，会将输入的历史记录显示在一个下拉列表里，以实现自动完成输入的功能。该属性有2个值：

on;表单有自动完成功能。

off：表单无自动完成功能。

input元素拥有多种输入类型即相关的属性，其常用的属性如下表：

属性	属性值	描述
type	text	单行文本输入框
	password	密码输入框
	checkbox	复选框
	button	普通按钮
	radio	单选按钮
	submit	提交按钮
	reset	重置按钮
	image	图像形式的提交按钮
	hidden	隐藏域
	file	文件域
	email	E-mail地址的输入域
	url	URL地址输入域
	number	数值的输入域
	range	一定范围内数字值的输入域
	date、month、week、time、datetime、datetime-local	日期和时间的输入类型
	search	搜索域
	color	颜色输入类型
	tel	电话号码输入类型
name	由用户自定义	控件的名称
value	由用户自定义	input控件中的默认文本值
size	正整数	input控件在页面中显示宽度
readonly	readonly	该控件内容为只读（不能编辑修改）
disabled	disabled	加载页面时禁用该控件（显示为灰色）
checked	checked	定义选择控件默认被选中的项
maxlength	正整数	控件允许输入的最多字符数
autocomplete	on/off	设定是否自动完成表单字段内容
autofocus	autofocus	指定页面加载后是否自动获取焦点
form	form元素的id	设定字段隶属于哪一个或哪几个表单
list	datalist元素的id	指定字段的候选数据值列表
multiple	multiple	指定输入框是否可以选择多个值
min、max和step	数值	指定输入框索允许的最大值、最小值及间隔
pattem	字符串	验证输入的内容是否与定义的正则表达式匹配
placeholder	字符串	为input类型的输入框提供一种提示
required	required	规定输入框填写的内容不能为空

number类型的input元素用于提供输入数值的文本框。具体属性有四个：

1、value：指定输入框的默认值。

2、max：指定输入框可以接受的最大的输入值。

3、min：指定输入框可以接受的最小的输入值。

4、step：输入域合法的间隔，如果不设置，默认值是1.list

Date Pickers类型是指时间日期类型，HTML5中提供了多个可供选取日和时间的输入类型。

时间和日期类型
时间和日期类型	说明
date	选取日、月、年
month	选取月、年
week	选取周和年
time	选取时间（小时和分钟）
datetime	选取时间、日、月、年（UTC时间）
datetime-local	选取时间、日、月、年（本地时间）

list属性用于设置数据列表，它可以指定输入框所绑定的datalist元素。list属性的值是某个datalist元素的id。

multiple属性指定输入框可以选择多个值，multiple属性用于file类型的input元素时表示可以选择多个文件。

placeholder属性用于为input类型的输入框提示相关信息以描述此输入框期待用户输入何种内容。

placeholder属性适用于type属性值为text、search、url、tel、email及password的标记。

required属性用于规定输入框填写的内容不能为空，否则不允许用户提交表单。

textarea元素：当定义input控件的type属性值为text时，可以创建一个单行文本输入框。但是如果需要输入大量的信息，单行文本输入框就不在适用，为此HTML5提供了textarea标记，通过其可以轻松地创建多行文本框。cols和rows为textarea标记的必须属性，其中cols用来定义多行文本输入框每行中的字符数，rows用来定义多行文本输入框显示行数，它们的取值均为正整数。textarea元素除了cols和rows属性外，还能拥有几个可选属性，分别为disabled、name和readonly

属性	属性值	描述
name	有用户定义	控件的名称
readonly	readonly	该控件内容为只读（不能编辑修改）
disabled	disabled	加载页面时禁用该控件（显示为灰色）

datalist元素定义输入框的选项列表，列表通过datalist内的option元素进行创建。datalist元素通常与input元素配合使用来定义input控件的取值。

Keygen元素用于设置表单的密钥生成器，能够使用户验证更为安全可靠。

keygen
属性	说明
autofocus	使Keygen字段在页面加载是获得焦点
challenge	如果使用则将Keygen的值设置为在提交时询问
disabled	禁用Keygen字段
form	定义该Keygen字段所属的一个或多个表单
Keygen	定义Keygen。rsa用于生成PSA密钥
name	定义Keygen元素的唯一名称，用于在用户提交表单时搜集字段的值

output元素用于不同类型的输出，可以在浏览器中显示计算结果或脚本输出。常有的属性有三个如下表：

属性	说明
for	定义输出域相关的一个或多个元素
form	定义输出字段所属的一个或多个表单
name	定义对象的唯一名称

使用HTML创建表单相关推荐

JavaFX官方教程（五）之在JavaFX中创建表单
翻译自在JavaFX中创建表单在开发应用程序时,创建表单是一项常见活动.本教程将向您介绍屏幕布局的基础知识,如何将控件添加到布局窗格以及如何创建输入事件. 在本教程中,您将使用JavaFX构建如 ...
angular js创建表单_如何优雅的使用 Angular 表单验证
随便说说,这一节可以跳过去年参加 ngChine 2018 杭州开发者大会的时候记得有人问我: Worktile 是什么时候开始使用 Angular 的,我说是今年(2018年) 3 月份开始在新模 ...
webform快速创建表单内容文件--oracle 数据库
使用方法前台页面这样写就足够了 <form class="stdform" runat="server"><div id="fie ...
Flask——创建表单模型类与模板使用
首先引入表单扩展Flask-WTF: pip install Flask-WTF 使用Flask-WTF扩展可以验证后端接受到的信息,防止恶意攻击. WTForms支持的HTML标准字段字段对象说 ...
JQuery 动态创建表单，并自动提交
前言:写这个是为了实现使用cookie进行自动登录的功能, 下面的代码是一个元素一个元素进行创建和赋值的, (可以尝试下将所有的html代码(form.input)全部拼好以后放到${ } 中,再进行 ...
使用Bootstrap-table创建表单，并且与flask后台进行数据交互
文章目录引用css和js 使用 html javascript flask mysql 参考引用css和js Bootstrap-table为这些文件提供了 CDN 的支持,所以不需要下载.js ...
一步步学习微软InfoPath2010和SP2010--第九章节--使用SharePoint用户配置文件Web service（2）--在事件注册表单上创建表单加载规则...
下面练习中,你将添加表单加载规则,将四个文本框域和图片控件与用户配置文件web service连接.当使用用户配置文件web service时,你需要将控件和来自web service合适的域绑定.这 ...
html创建表单用设么,如何使用HTML创建表单的发送
HTML除了显示字符和图像的语言以外,其实还具有创建简单表单的功能,本篇文章就来给大家分享关于如何使用HTML格式创建发送表单. 我们先来解释一下表单元素:表单元素是创建提交表单的必要元素. 基本格式 ...
JS创建表单提交备份
//保存function saveFT() {var data = {createDate: GetDateStr(0),name: $("#txtName").val(),gen ...
【原创文章】PHP+MySQL 创建表单并将表单数据写入数据库中。
前言因兴趣做一个静态网页需要涉及到内容存储,因此有了本文内容.本文涉及到的都是些PHP+MySQL的基础知识.仅个人做记录,文章内容未经允许禁止转载! 一.网站环境宝塔面板,方便操作. N ...

使用HTML创建表单

使用HTML创建表单相关推荐

最新文章

热门文章