HTML5 form properties


HTML5's

and tags add several new attributes.

New attributes:

  • autocomplete

  • novalidate

New attribute:

  • autocomplete

  • autofocus

  • form

  • ##formaction

  • formenctype

  • formmethod

  • formnovalidate

  • formtarget

  • height and width

  • list

  • min and max

  • multiple

  • pattern (regexp)

    • ##placeholder

    • required

    • step

    • ## / autocomplete attribute
The autocomplete attribute specifies that the form or input field should have autocomplete functionality.

When the user starts typing in an autocomplete field, the browser should display the filled-in options in that field.

Tips:

The autocomplete attribute may be turned on in the form element but turned off in the input element.

Note:

autocomplete applies to tags, as well as the following types of tags: text, search, url, telephone, email, password, datepickers, range and color .

Instance

    php中文网(php.cn) 

   First name:
 Last name: 
 E-mail: 
   
填写并提交表单，然后重新刷新页面查看如何自动填充内容。
 
注意 form的 autocomplete属性为 "on"（开），但是e-mail自动为“off”（关）。

Run instance»

Click the "Run instance" button to view the online instance

Tips:
In some browsers, you may need to enable the autocomplete function for this attribute to take effect.

novalidate attribute

A boolean attribute of the novalidate attribute.

The novalidate attribute specifies that the form or input field should not be validated when submitting the form.

Instance

    php中文网(php.cn) 

   E-mail:    
注意在 Safari 和 Internet Explorer 9 及之前的版本中不支持 novalidate 属性。

Run instance»

Click the "Run instance" button to view the online instance

autofocus attribute
The autofocus attribute is a boolean attribute.

The autofocus attribute specifies that the field automatically gains focus when the page is loaded.

Instance

    php中文网(php.cn) 

  
 First name: 
 Last name: 
  
 
注意： Internet Explorer 9及更早IE版本不支持input标签的 autofocus 属性。

Run instance»

Click the "Run instance" button to view the online instance

form attribute
The form attribute specifies one or more forms to which the input field belongs.

Tip:

If you need to reference more than one form, please use a space-separated list.


Example

    php中文网(php.cn) 

  
 First name: 
  
 
 "Last name" 字段没有在form表单之内，但它也是form表单的一部分。
 Last name:  
注意: IE不支持form属性


Run instance»

Click the "Run instance" button to view the online instance

formaction attribute

The formaction The attribute is used to describe the URL address for form submission.

The formaction attribute will override the action attribute in the

element.

Note:The formaction attribute is used to type="submit" and type="image".

Instance

    php中文网(php.cn) 

   First name: 
 Last name: 
 
   
注意： Internet Explorer 9及更早IE版本不支持input标签的 formaction 属性。

Run instance»

Click "Run" Example" button to view online examples


## formenctype attribute

formenctype attribute describes the data encoding of the form submitted to the server (only for form forms method="post" form)

The formenctype attribute overrides the enctype attribute of the form element.

Main:This attribute is used with type="submit" and type="image".

Instance 

    php中文网(php.cn) 

  
 First name: 
   
 
注意： Internet Explorer 9及更早IE版本不支持input标签的 formenctype 属性。

Run Instance» Click the "Run Instance" button to view the online instance


formmethod attribute

The formmethod attribute defines how the form is submitted.

The formmethod attribute overrides the method attribute of the
element.

Note:This attribute can be used with type="submit" and type="image".

Instance 

    php中文网(php.cn) 

   First name: 
 Last name: 
    
注意： Internet Explorer 9及更早IE版本不支持input标签的 formmethod 属性。

Run Instance» Click the "Run Instance" button to view the online instance

formnovalidate attribute

The novalidate attribute is a boolean attribute.

The novalidate attribute describes that the element does not need to be verified when the form is submitted.

The formnovalidate attribute will override the novalidate attribute of the
element.

Note:The formnovalidate attribute is used together with type="submit

Instance 

    php中文网(php.cn) 

   E-mail: 
 
   
注意： Internet Explorer 9及更早IE版本,或Safari不支持input标签的 formnovalidate 属性。

Run instance» Click the "Run instance" button to view the online instance


# # formtarget attribute

The formtarget attribute specifies a name or a keyword to indicate the display of form submission data after it is received.

The formtarget attribute overrides the target attribute of the

element. .

Note:

The formtarget attribute is used with type="submit" and type="image".

Example 

    php中文网(php.cn) 

   First name: 
 Last name: 
    
注意： Internet Explorer 9及更早IE版本不支持input标签的 formtarget 属性。


Run instance»

Click the "Run instance" button to view the online instance


## height and width attributes

The height and width attributes specify the image height and width used for tags of type image.

Note:The height and width attributes are only applicable to tags of image type.

Tip:Images usually specify both height and width attributes. If the image sets height and width, the space required by the image Will be retained when loading the page. Without these properties, The browser does not know the size of the image and cannot reserve it Proper space. The image will change the page layout effect during the loading process (Though the image is loaded).

Instance 

    php中文网(php.cn) 

  
 First name: 
 Last name:

Run Instance» Click the "Run Instance" button to view the online instance


list attribute

list attribute specifies the datalist of the input field. datalist is a list of options for the input field.

Instance 

    php中文网(php.cn) 

  
     
 
注意: Internet Explorer 9（更早IE版本），Safari不支持 datalist 标签。

Run Instance» Click the "Run Instance" button to view the online instance


min and max attributes

The min, max, and step attributes are used to specify limits (constraints) for input types that contain numbers or dates.

Note:The min, max, and step attributes apply to the following types of tags: date pickers, number, and range.

Instance 

    php中文网(php.cn) 

  
 输入 1980-01-01 之前的日期: 
 输入 2000-01-01 之后的日期: 
 数量 (在1和5之间): 
  
 
注意: Internet Explorer 9及更早IE版本，Firefox不支持input标签的 max 和 min 属性。
 
注意: 在Internet Explorer 10中max 和 min属性不支持输入日期和时间，IE 10 不支持这些输入类型。

Run Instance» Click the "Run Instance" button to view the online instance


multiple attribute

The multiple attribute is a boolean attribute.

The multiple attribute specifies that multiple values can be selected in the element.

Note:The multiple attribute applies to the following types of tags: email and file. : email, and file.

Instance 

    php中文网(php.cn) 

  
 选择图片:   
 
尝试选取一张或者多种图片。
 
注意: Internet Explorer 9及更早IE版本不支持input标签的 multiple 属性。

Run Instance» Click the "Run Instance" button to view the online instance


pattern attribute

The pattern attribute describes a regular expression used to validate the value of the element.

Note:The pattern attribute applies to the following types of tags: text, search, url, tel, email, and password.

Tips :is used for the global title attribute to describe the pattern.

Tips:You can learn about regular expressions in our JavaScript tutorial

Instance

    php中文网(php.cn) 

  
 Country code:   
 
注意: Internet Explorer 9及更早IE版本，或Safari不支持input标签的 pattern 属性。

Run Instance»

Click the "Run Instance" button to view the online instance


placeholder attribute

The placeholder attribute provides a hint describing the value expected by the input field.

A brief prompt will be displayed on the input field before the user enters a value.

Note:The placeholder attribute applies to the following types of tags: text, search, url, telephone, email and password.

Instance

    php中文网(php.cn) 

  
 
 
  
 
注意： Internet Explorer 9及更早IE版本不支持input标签的 placeholder 属性。

Run Instance»

Click the "Run Instance" button to view the online instance


required attribute

The required attribute is a boolean attribute. The

required attribute specifies that the input field must be filled in before submission (cannot be empty).

Note:The required attribute applies to the following types of tags: text, search, url, telephone, email, password, date pickers, number, checkbox, radio and file.

Instance

    php中文网(php.cn) 

  
 Username:   
 
注意： Internet Explorer 9及更早IE版本，或Safari不支持input标签的 required 属性。

Run Instance»

Click the "Run Instance" button to view the online instance


step attribute

The step attribute specifies the legal number interval for the input field.

If step="3", the legal numbers are -3,0,3,6, etc.

Tips:The step attribute can be used with The max and min attributes create a range value.

Note:The step attribute is used with the following types: number, range, date, datetime, datetime-local, month, time and week.

Instance

    php中文网(php.cn) 

  
   
 
注意： Internet Explorer 9及更早IE版本，或Firefox不支持input标签的 step 属性。

Run Instance»

Click the "Run Instance" button to view the online instance

HTML5 Tags

←
→

php.cn

HomeHome CourseCourse ArticleArticle Q&AQ&A DictionaryDictionary ManualManual DownloadDownload searchsearch APPDownloadAPPDownload
##Tag Description ; Define a form Define an input field ##