Home>Article>Web Front-end> What are the new form controls and form attributes in HTML5?

What are the new form controls and form attributes in HTML5?

王林
王林 forward
2021-03-11 10:42:50 3125browse

What are the new form controls and form attributes in HTML5?

HTML5 is the next generation standard of the Internet and a language method for constructing and presenting Internet content. It is considered to be one of the core technologies of the Internet.

HTML5 is the specification of the core language HTML in the Web. The content that users see when browsing the web using any means is originally in HTML format. It is converted into a recognizable format through some technical processing in the browser. Information. HTML5 has made certain improvements on the basis of the previous HTML4.01. Although technical personnel may not put these new technologies into application during the development process, website development technical personnel must be aware of the new features of this technology. understand.

New input form control:

  • email: Email text box, no different from ordinary ones

  • - When the input is not an email address, the verification fails

  • - The keyboard on the mobile terminal will change

  • tel: phone number

  • url: URL of the webpage

  • search: search engine

  • - After entering text under chrome, there will be more A closed

  • ## - Example: Use js to display the current value
  • number: an input box that can only contain numbers
  • - There are two arrows at the end of the input box. The upper arrow is for plus and the lower arrow is for minus.
  • Color: Color Selector
  • - Click to display the color version
  • datetime: Display the complete date
  • - Similar to select selection style
  • datetime-local: Display the complete date Date, excluding time zone
  • time: display time, excluding time zone
  • date: display date {year, month, day}
  • week: display the week {year, month, day, week}
  • mouth: display the month {year, month}
  • ## (Free video tutorial:
  • html video tutorial
  • )

    New form features and functions
  • placeholder: input box prompt information

- Example: Weibo password box prompt

autocomplete
  • - The default is on, turn off the prompt selection off
  • autofocus: Specify the form to obtain the 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 Verification

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

  • Formaction defines the submission address in submit

  •  // required 和 pattern 具有安全隐患 如果在控制台修改input的pattern和required 那么就可以破除校验 // 如果用户在某个页面输入相当多的数据,临时有事需要离开一段时间,此时数据应该保存至草稿箱,那么同一个form表单下,将会有两个不同地址的sumbit提交 ope浏览器已支持 其余浏览器可能不支持 

    Related recommendations:

    html5 tutorial

The above is the detailed content of What are the new form controls and form attributes in HTML5?. For more information, please follow other related articles on the PHP Chinese website!

Statement:
This article is reproduced at:cnblogs.com. If there is any infringement, please contact admin@php.cn delete
Previous article:What does 5 in html5 mean? Next article:What does 5 in html5 mean?