📜  HTML 表单属性

📅  最后修改于: 2020-11-01 11:28:26             🧑  作者: Mango

HTML表单属性

HTML
元素属性

在HTML中,可以使用各种属性元素如下:

HTML动作属性

的动作属性元素定义提交表单时要在表单上执行的过程,或者它是用于处理表单信息的URI。

动作属性值定义了进行信息的网页。它可以是.php,.jsp,.asp等,也可以是您要处理表单的任何URL。

注意:如果动作属性值为空白,则表单将被处理到同一页面。

例:

  
     





输出:

Demo of action attribute of form element

 




It will redirect to a new page “action.html” when you click on submit button

HTML方法属性

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

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

例:

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

例:


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

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

HTML目标属性

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

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

例:

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

例:

 

HTML自动完成属性

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

例:


例:


注意:它可以与元素和两者都。

HTML enctype属性

HTML enctype属性定义了在将表单提交给服务器时表单内容的编码类型。 enctype的可能值为:

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

例:


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

例:


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

例:


HTML novalidate属性HTML5

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

例:


输出:

Fill the form


Enter name:

Enter age:

Enter email:


Try to change the form detials with novalidate atttribute and without novalidate attribute and see the difference.

的HTML元素属性

HTML名称属性

HTML名称属性定义了输入元素的名称。提交表单时,name和value属性包含在HTTP请求中。

注意:不应忽略name属性,因为当我们提交表单时,HTTP请求将同时包含name-value对,如果name不可用,它将不会处理该输入字段。

例:

Enter name:

Enter age:

Enter email:

输出:

Fill the form

Enter 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值属性定义输入字段的初始值或默认值。

例:










输出:

Fill the form




Note: In password input filed the value attribute will always unclear

HTML必需属性HTML5

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

例:







输出:

Fill the form



If you will try to submit the form without completing email field then it will give an error pop up.

HTML自动对焦属性HTML5

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

例:







HTML占位符属性HTML5

占位符属性在输入字段中指定一个文本,该文本通知用户该字段的预期输入。

占位符属性可以与文本,密码,电子邮件和URL值一起使用。

当用户输入值时,占位符将被自动删除。

例:










输出:

Registration form




HTML禁用属性

应用HTML禁用属性后,它将禁用该输入字段。禁用字段不允许用户与该字段进行交互。

禁用的输入字段不会收到单击事件,并且在提交表单时,这些输入值不会发送到服务器。

例:



输出:

Registration form




HTML大小属性

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

例:










输出:

Registration form with disbaled attribute




HTML表单属性

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

例:

User email: 

输出:

User Name:

User password:

The email field is outside the form but still it will remain part of the form

User email: