The type attribute specifies the type of input element.
Note: This attribute is not required, but we think you should always use it.
<!DOCTYPE html><html lang=en><head> <meta charset=UTF-8> <meta name=viewport content=width=device-width, initial-scale=1.0> <meta http-equiv=X-UA -Compatible content=ie=edge> <title>color picker</title></head><body> <input type=color id=color></body><script> document.querySelector(#color).onchange = function () { document.getElementById('color').click(); // A click event must be added to trigger otherwise the color change cannot be triggered by clicking the OK button document.body.style.background = this.value; }</script></html> Let’s take a look at the HTML 5 <input> type attributeattribute value
| value | describe |
|---|---|
| button | Define clickable buttons (mostly used with JavaScript to launch scripts) |
| checkbox | Define checkboxes. |
| color | Define the color picker. |
| date | Define date fields (with calendar control) |
| datetime | Define date fields (with calendar and time controls) |
| datetime-local | Define date fields (with calendar and time controls) |
| month | Define the month of the date field (with calendar control) |
| week | Define the week of the date field (with calendar control) |
| time | Define the hours, minutes, and seconds of a date field (with time control) |
| Define the text field used for e-mail addresses | |
| file | Define input fields and browse... buttons for file uploads |
| hidden | Define hidden input fields |
| image | Define image as submit button |
| number | Define a numeric field with a spinner control |
| password | Define the password field. Characters in the field are masked. |
| radio | Define radio buttons. |
| range | Define a numeric field with a slider control. |
| reset | Define the reset button. The reset button will reset all form fields to their initial values. |
| search | Define the text field used for searching. |
| submit | Define the submit button. The submit button sends data to the server. |
| tel | Define a text field for phone numbers. |
| text | default. Define a single-line input field where users can enter text. The default is 20 characters. |
| url | Defines the text field used for the URL. |
The above is the example code of the new type attribute color color picker for HTML5 input introduced by the editor. I hope it will be helpful to you. If you have any questions, please leave me a message and the editor will reply to you in time. I would also like to thank everyone for your support of the VeVb martial arts website!