Home > Article > Web Front-end > HTML5 new form elements
HTML5 new form elements
- 不言Original
- 2018-05-08 11:09:591284browse
This article mainly introduces the new form elements of HTML5, which has certain reference value. Now I share it with everyone. Friends in need can refer to it
##HTML5 fc86e7b705049fc9d4fccc89a2e80ee3 Element
The fc86e7b705049fc9d4fccc89a2e80ee3 element specifies the option list of the input field
The fc86e7b705049fc9d4fccc89a2e80ee3 attribute specifies that the form or input field should Has autocomplete feature. When the user begins typing in an autocomplete field, the browser should display the filled-in options in that field;
Use the list attribute of the d5fd7aea971a85678ba271703566ebfd element with the fc86e7b705049fc9d4fccc89a2e80ee3 element Binding.
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8" /> <title>自选教程(如约智惠.com)</title> </head> <body > <form action="demo-form.php" method="get"> <input list="browsers" name="browser"> <datalist id="browsers"> <option value="Internet Explorer"></option> <option value="Firefox"></option> <option value="Chrome"></option> <option value="Opera"></option> <option value="Safari"></option> </datalist> <input type="submit"> </form> <p> <strong>注意：</strong>Internet Explorer 9， Safari 不支持 datalist 标签。 </p> </body> </html>
#HTML5 aa983b9eb8086376f1f6481364a02e5aElement
The purpose of the aa983b9eb8086376f1f6481364a02e5a element is to provide a reliable method of authenticating users.The aa983b9eb8086376f1f6481364a02e5a tag specifies the key pair generator field used for the form.
When the form is submitted, two keys will be generated, one is the private key and the other is the public key.
The private key is stored on the client, and the public key is sent to the server. The public key can be used later to verify the user's client certificate.
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" />
<title>自选教程(如约智惠.com)</title>
</head>
<body >
<form action="demo-form.php" method="get">
用户名：<input list="text" name="usr_name">
密码：<keygen name="security">
</datalist>
<input type="submit">
</form>
<p>
<strong>注意：</strong>Internet Explorer 不支持 keygen标签。
</p>
</body>
</html>
The be6d67dae90cc1ad6469079e163d0939 element is used for different types of output, such as calculation or script output:
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8" /> <title>自选教程(如约智惠.com)</title> </head> <body > <form oninput="x.value=parseInt(a.value)+parseInt(b.value)"> 0 <input type="range" id="a" value="50"> 100 +<input type="number" id="b" value="50"> =<output name="x" for="a b"></output> </form> <p> <strong>注意：</strong>Internet Explorer 不支持 output 标签。 </p> </body> </html>
HTML5 New Form Element
## Tag
| fc86e7b705049fc9d4fccc89a2e80ee3 | |
|---|---|
| aa983b9eb8086376f1f6481364a02e5a | |
| be6d67dae90cc1ad6469079e163d0939 | |
The above is the detailed content of HTML5 new form elements. For more information, please follow other related articles on the PHP Chinese website!