HTML5 new form controls and form properties

New Input form controls:

Email: e-mail text box, no difference from normal

-When the input is not a mailbox, the validation does not pass

-The keyboard on the mobile side is changed

Tel: Phone number

URL: URL of a Web page

Search : Searching engine

-When you enter text under Chrome, you'll get a more closed x

Range: A numeric selector in a specific range

-Min, Max, step (steps)

-Example: Use JS to display the current value

Number: An input box that can contain only numbers

-Two arrows at the end of the input box are added as minus

Color : Colour picker

-click Show Color Version

DateTime: Show Full date

-Similar select selection style

Datetime-local: Full date is displayed, no time zone is included

Time: Display times with no time zone

Date: Display Day {Month Day}

Week: Show week {Month Day week}

Mouth: Show months {month}

<form>  <inputtype= "Email" />  <inputtype= "Tel" />  <inputtype= "url" />  <inputtype= "Search" />  <!--a slider plus a long min minimum representation number Max Max represents number of steps to jump a few numbers -  <inputtype= "Range"min= "1"Max= "Ten"Step= "2"/>
<!---->
<input type= "Number"/>
<input type= "Color"/>
  <inputtype= "Submit" /></form>

New form attributes and functions

placeholder: input box prompt information

-Example: micro-blog Password box hint

AutoComplete

-Default is on, turn off prompt select off

Autofocus: Specify form to get input focus

List and DataList: Construct a selection list for the input box

-the list value is the ID of the DataList tag

Required: This option is required and cannot be empty

Pattern: Regular validation

-pattern= "\d{1,5}"

FormAction define submission address in submit

<input type= "Text"placeholder= "Please enter 4-16 characters"//Display in the input boxAutocomplete= "Off"//whether to record input valuesAutofocus//SpotlightRequired//the input box cannot be emptyPattern= "\d{1,5}"//1 to 5 digits must be entered/>//required and pattern have security implications if you modify the pattern and required of input in the console , you can break the checksum//if the user in a page to enter a considerable amount of data, temporary things need to leave a period of time, the data should be saved to the draft box, then the same form form, there will be two different addresses Sumbit submit Ope browser has supported the rest of the browser may not support<form action= "https://www.baidu.com" > <input type= "text" > <input type= "Submit" value= "Submit"/> <inp UT type= "Submit" value= "Save to draft box" formaction= "http://www.miaov.com"/></form>

HTML5 new form controls and form properties