The new form elements HTML5

Recommended for you: Get network issues from WhatsUp Gold. Not end users.

HTML5 has several relates to form elements and attributes.

This chapter introduces the following new form elements:

Browser support

Input typeIEFirefoxOperaChromeSafari
datalist No No 9.5 No No
keygen No No 10.5 3.0 No
output No No 9.5 No No

The datalist element

The datalist element provides a list of options for the input domain.

The list was created by option elements within the datalist.

If need to bind the datalist to the input domain, please datalist ID using the list attribute reference input domain:


Webpage: <input type="url" list="url_list" name="link" />
<datalist id="url_list">
<option label="W3School" value="" />
<option label="Google" value="" />
<option label="Microsoft" value="" />

Have a try

Note: the option elements will be setting the value property.

The keygen element

The keygen element is a reliable method to provide a user authentication.

The keygen element is the key to the generator (key-pair generator). When submitting the form, will generate two keys, and a private key, a public key.

The private key (private key) is stored in the client, the public key (public key) is sent to the server. The public key can be used to validate user client certificate after(client certificate).

At present, the browser has elements of bad support is not sufficient to make it a useful safety standards.


<form action="demo_form.asp" method="get">
Username: <input type="text" name="usr_name" />
Encryption: <keygen name="security" />
<input type="submit" />

Have a try

The output element

The output element is used to output different types, such as computing or script output:


<output id="result" onforminput="resCalc()"></output>
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download

Posted by Helena at December 07, 2013 - 10:22 PM