" tag element, which can define predefined options of input controls; 2. "" tag element, which can define key pair generator fields (for forms); 3. , "" tag element can define calculation results."/> " tag element, which can define predefined options of input controls; 2. "" tag element, which can define key pair generator fields (for forms); 3. , "" tag element can define calculation results.">

Home >Web Front-end >Front-end Q&A >What are the new elements in html5 forms?

What are the new elements in html5 forms?

青灯夜游
青灯夜游Original
2022-01-23 17:44:494070browse

The new elements in the html5 form are: 1. The "" tag element can define the predefined options of the input control; 2. The "" tag element can define the key pair generator Field (for forms); 3. "" tag element can define calculation results.

What are the new elements in html5 forms?

The operating environment of this tutorial: Windows 7 system, HTML5 version, Dell G3 computer.

New elements in html5 form

Tag Description
Define the predefined options of the input control.
Define key pair generator fields (for use with forms).
Define the calculation result.

1. tag

tag specifies a list of possible options for the element .

The tag is used to provide "auto-complete" features for the element. The user will see a drop-down list with predefined options that will serve as the user's input data.

Please use the list attribute of the element to bind the element.

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
</head>
<body>
	
<form action="#" method="get">
<input list="browsers" name="browser">
<datalist id="browsers">
  <option value="Internet Explorer">
  <option value="Firefox">
  <option value="Chrome">
  <option value="Opera">
  <option value="Safari">
</datalist>
<input type="submit">
</form>

</body>
</html>

What are the new elements in html5 forms?

2, tag

tag specifies the key pair generator used for the form field.

When the form is submitted, the private key is stored locally and the public key is sent to the server.

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
</head>
<body>

<form action="demo_keygen.php" method="get">
  用户名: <input type="text" name="usr_name">
  加密: <keygen name="security">
  <input type="submit">
</form>

</body>
</html>

What are the new elements in html5 forms?

3. tag

tag is displayed as the calculation result output (such as executing a script output).

<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>

What are the new elements in html5 forms?

Related recommendations: "html video tutorial"

The above is the detailed content of What are the new elements in html5 forms?. 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