本文概述

• HTML < form> 元素属性
• HTML动作属性
• HTML目标属性
• HTML自动完成属性
• HTML enctype属性
• HTML novalidate属性HTML5
• HTML < input> 元素属性
• HTML名称属性
• HTML值属性
• HTML必需属性HTML5
• HTML自动对焦属性HTML5
• HTML占位符属性HTML5
• HTML禁用属性
• HTML大小属性
• HTML表单属性

HTML < form> 元素属性在HTML中, < form> 元素有多种可用属性, 如下所示：
HTML动作属性< form> 元素的action属性定义提交表单时要在表单上执行的过程, 或者它是用于处理表单信息的URI。
动作属性值定义了进行信息的网页。它可以是.php, .jsp, .asp等, 也可以是你要处理表单的任何URL。
注意：如果动作属性值为空白, 则表单将被处理到同一页面。例：

< form action="action.html" method="post"> < label> User Name:< /label> < br> < input type="text" name="name"> < br> < br> < label> User Password< /label> < br> < input type="password" name="pass"> < br> < br> < input type="submit"> < /form>

立即测试
输出：

Demo of action attribute of form elementUser Name:User PasswordIt will redirect to a new page "action.html" when you click on submit button

HTML方法属性
method属性定义浏览器用来提交表单的HTTP方法。方法属性的可能值为：

• post：我们要处理敏感数据时可以使用method属性的post值, 因为它不会在URL中显示已提交的数据。

例：

< form action="action.html" method="post">

• get：提交表单时, method属性的get值为默认值。但这并不安全, 因为在提交表单后, 它会在URL中显示数据。

例：

< form action="action.html" method="get">

提交数据时, 它将以以下形式显示输入的数据：

file:///D:/HTML/action.html?name=srcmini& pass=123

HTML目标属性target属性定义提交表单后在何处打开响应。以下是与target属性一起使用的关键字。

• _self：如果我们将_self用作属性值, 则响应仅显示在当前页面中。

例：

< form action="action.html" method="get" target="_self">

• _blank：如果我们使用_blank作为属性, 它将在新页面中加载响应。

例：

< form action="action.html" method="get" target="_blank">

HTML自动完成属性HTML自动完成属性是HTML5的新添加的属性, 它使输入字段能够自动完成。它可以有两个值“ on”和“ off”, 以启用“ ON”或“ OFF”自动完成功能。自动完成属性的默认值为“ on”。
例：

< form action="action.html" method="get" autocomplete="on">

例：

< form action="action.html" method="get" autocomplete="off">

注意：它可以与< form> 元素和< input> 元素一起使用。HTML enctype属性HTML enctype属性定义了在将表单提交给服务器时表单内容的编码类型。 enctype的可能值为：

• application / x-www-form-urlencoded：如果表单中未包含enctype属性, 则为默认编码类型。提交表单之前, 所有字符均已编码。

例：

< form action="action.html" method="post" enctype="application/x-www-form-urlencoded" >

• multipart / form-data：不编码任何字符。当我们的表单包含文件上传控件时使用它。

例：

< form action="action.html" method="post" enctype="multipart/form-data">

• 文本/纯文本（HTML5）：在此编码类型中, 仅空格被编码为+符号, 而没有任何其他特殊字符被编码。

例：

< form action="action.html" method="post" enctype="text/plain" >

HTML novalidate属性HTML5novalidate属性是HTML5的新添加的布尔属性。如果我们在表单中应用此属性, 则它不会执行任何类型的验证并提交表单。
例：

< form action = "action.html" method = "get" novalidate>

立即测试
输出：

Fill the formEnter name:Enter age:Enter email:Try to change the form detials with novalidate atttribute and without novalidate attribute and see the difference.

HTML < input> 元素属性HTML名称属性HTML名称属性定义输入元素的名称。提交表单时, name和value属性包含在HTTP请求中。
注意：不应忽略name属性, 因为当我们提交表单时, HTTP请求将同时包含name-value对, 并且如果name不可用, 它将不会处理该输入字段。例：

< form action = "action.html" method = "get"> Enter name:< br> < input type="name" name="uname"> < br> Enter age:< br> < input type="number" name="age"> < br> Enter email:< br> < input type="email"> < br> < input type="submit" value="http://www.srcmini.com/Submit"> < /form>

立即测试
输出：

Fill the formEnter name:Enter age:Enter email:Note: If you will not use name attribute in any input field, then that input field will not be submitted, when submit the form.Click on submit and see the URL where email is not included in HTTP request as we have not used name attribute in the email input field

HTML值属性HTML值属性定义输入字段的初始值或默认值。
例：

< form> < label> Enter your Name< /label> < br> < input type="text" name="uname" value="http://www.srcmini.com/Enter Name"> < br> < br> < label> Enter your Email-address< /label> < br> < input type="text" name="uname" value="http://www.srcmini.com/Enter email"> < br> < br> < label> Enter your password< /label> < br> < input type="password" name="pass" value=""> < br> < br> < input type="submit" value="http://www.srcmini.com/login"> < /form>

立即测试
输出：

Fill the form Enter your NameEnter your Email-addressEnter your passwordNote: In password input filed the value attribute will always unclear

HTML必需属性HTML5所需的HTML是布尔属性, 它指定用户必须在提交表单之前填写该字段。
例：

< form> < label> Enter your Email-address< /label> < br> < input type="text" name="uname" required> < br> < br> < label> Enter your password< /label> < br> < input type="password" name="pass"> < br> < br> < input type="submit" value="http://www.srcmini.com/login"> < /form>

立即测试
输出：

Fill the form Enter your Email-addressEnter your passwordIf you will try to submit the form without completing email field then it will give an error pop up.

HTML自动对焦属性HTML5自动聚焦是一个布尔属性, 可在加载网页时使字段自动聚焦。
例：

< form> < label> Enter your Email-address< /label> < br> < input type="text" name="uname" autofocus> < br> < br> < label> Enter your password< /label> < br> < input type="password" name="pass"> < br> < br> < input type="submit" value="http://www.srcmini.com/login"> < /form>

HTML占位符属性HTML5占位符属性在输入字段中指定一个文本, 该文本通知用户该字段的预期输入。
占位符属性可以与文本, 密码, 电子邮件和URL值一起使用。
当用户输入值时, 占位符将被自动删除。
例：

< form> < label> Enter your name< /label> < br> < input type="text" name="uname" placeholder="Your name"> < br> < br> < label> Enter your Email address< /label> < br> < input type="email" name="email" placeholder="example@gmail.com"> < br> < br> < label> Enter your password< /label> < br> < input type="password" name="pass" placeholder="your password"> < br> < br> < input type="submit" value="http://www.srcmini.com/login"> < /form>

立即测试
输出：

Registration formEnter your nameEnter your Email addressEnter your password

HTML禁用属性应用HTML禁用属性后, 它将禁用该输入字段。禁用字段不允许用户与该字段进行交互。
禁用的输入字段不会接收单击事件, 并且在提交表单时, 这些输入值不会发送到服务器。
例：

< input type="text" name="uname" disabled> < br> < br>

立即测试
输出：

Registration formEnter User nameEnter your Email addressEnter your password

HTML大小属性size属性控制以键入字符表示的输入字段的大小。
例：

< label> Account holder name< /label> < br> < input type="text" name="uname" size="40" required> < br> < br> < label> Account number< /label> < br> < input type="text" name="an" size="30" required> < br> < br> < label> CVV< /label> < br> < input type="text" name="cvv"size="1" required> < br> < br>

立即测试
输出：

Registration form with disbaled attribute Account holder nameAccount numberCVV

HTML表单属性HTML表单属性允许用户指定在表单外部提交的输入, 但仍是父表单的一部分。
例：

User email: < br> < input type="email" name="email"form="fcontrol"required> < br> < input type="submit" form="fcontrol">

立即测试
【HTML表单属性】输出：

User Name:User password:The email field is outside the form but still it will remain part of the formUser email:

推荐阅读

• 

  肺最爱八种白色食物
• 

  玉豆怎么做好吃? 玉豆怎么做好吃
• 

  王满银名字打分109分
• 

  布洛芬是小孩用的还是大人用的 小孩能用布洛芬吗
• 

  客家人的酸柑茶
• 

  松下空调制热不制冷故障排除图片全部原因有哪些,改掉这三个陋习
• 

  全民k诗怎么合诵诗歌？全民k诗合诵诗歌的方法
• 

  灵芝怎么保存
• 

  应用电子技术专业学什么，应用电子技术专业学什么就业前景
• 

  dnf偷学技能任务_dnf偷学技能任务怎么做
• 

  pet1可以重复装冷水吗 pet1可不可以重复装冷水
• 

  山根低适合做哪种隆鼻 山根低怎么补救
• 

  山东博物馆恢复开放公告 山东省博物馆开放
• 

  尼康发展史 2014尼康有什么新动向
• 

  包含python装饰器原函数的词条
• 

  粽子馅怎么调制才好吃啊
• 

  李尔韦恩mv 李尔韦恩捡肥皂的梗
• 

  信用卡逾期了4个月会被起诉吗，信用卡逾期了4个月会被起诉吗怎么办
• 

  感恩日记152/200
• 

  三个字网名女生

• HTML表单输入类型
• HTML表单详解
• HTML input标签
• HTML图片
• HTML iframe用法
• HTML ID属性
• HTML html标记
• HTML hr标签
• HTML H标题标签