Home  >  Article  >  Web Front-end  >  What is HTML5 input number? Detailed introduction of HTML5 input type (internal dependency diagram)

What is HTML5 input number? Detailed introduction of HTML5 input type (internal dependency diagram)

寻∝梦
寻∝梦Original
2018-08-16 17:40:296468browse

What is HTML5 input number? Detailed introduction to HTML5 input type. This article explains in detail what HTML5 input number is, how to use it, as well as some introduction to HTML5 input type and description of attribute values.

What are the input types of HTML5 input type? :

This chapter provides a comprehensive introduction to these new input types:

  • email

  • url

  • number

  • range

  • Date pickers (date, month, week, time, datetime, datetime-local)

  • search

  • color

##HTML5 input type - number:

The number type is used for input fields that should contain numeric values.

html5’s new number input type will call up the numeric keyboard when the input box gets focus, increasing the experience. However, on some Android machines, it is still possible to switch character input, and users may accidentally enter non-numeric characters such as " " and "—". After testing, the number type will automatically ignore alphabetic characters and other non-numeric characters, except for the two characters """-""." which can be entered, because these two are symbols for positive and negative numbers and decimal points.

Another point of the number type is that if the content in the input box is not a pure number (either positive or negative) and the content contains some characters, the value of the corresponding dom element will be empty ("" ).

You can also set limits on the numbers accepted:

Example:

Points:

Please use the following attributes to specify the limit on the number type:

What is HTML5 input number? Detailed introduction of HTML5 input type (internal dependency diagram)

Tip: in iPhone Safari supports the number input type and changes the touchscreen keyboard to accommodate it (to display numbers).

HTML 5 type (style) attribute:

This is an example:

Form with different input types:

<form action="demo_form.asp" method="get">
  First name: <input type="text" name="fname" /><br />
  Last name: <input type="text" name="lname" /><br />
  <input type="submit" value="Submit" />
</form>

Definition and usage:

The type attribute specifies the type of input element.

Note: This attribute is not required, but we think you should always use it.

Syntax:

Attribute value:

What is HTML5 input number? Detailed introduction of HTML5 input type (internal dependency diagram)

【Related Recommended】

What are the new structural elements of HTML5? Usage of new structural elements in HTML5 (recommended)

What is the lang attribute in HTML for? What does the lang attribute in HTML do?


The above is the detailed content of What is HTML5 input number? Detailed introduction of HTML5 input type (internal dependency diagram). For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn