HTML5 新的表單元素
本章介紹以下新的表單元素：?
?datalist?
?keygen?
?output?
瀏覽器支持
Input type ? ? IE ? ?Firefox ? ??Opera ??Chrome ??Safari
datalist ? ? ? ? ?No ? ? ?No ? ? ? ? ? 9.5 ? ? ? ? No ? ?No ? ?
keygen ? ? ? ? ?No ? ? ?No ? ? ? ? ? 10.5 ? ? ? 3.0 ? ?No ? ?
output ? ? ? ? ? No ? ? ?No ? ? ? ? ? ?9.5 ? ? ? ?No ? ?No ? ?
datalist 元素?
datalist 元素規(guī)定輸入域的選項(xiàng)列表。?
列表是通過 datalist 內(nèi)的 option 元素創(chuàng)建的。?
如需把 datalist 綁定到輸入域，請(qǐng)用輸入域的 list 屬性引用 datalist 的 id：?
代碼如下:
Webpage: <input type="url" list="url_list" name="link" />?
<datalist id="url_list">?
<option label="W3School" value="http://www.W3School.com.cn" />?
<option label="Google" value="http://www.google.com" />?
<option label="Microsoft" value="http://www.microsoft.com" />?
</datalist>?
提示：option 元素永遠(yuǎn)都要設(shè)置 value 屬性。?
keygen 元素?
keygen 元素的作用是提供一種驗(yàn)證用戶的可靠方法。?
keygen 元素是密鑰對(duì)生成器（key-pair generator）。當(dāng)提交表單時(shí)，會(huì)生成兩個(gè)鍵，一個(gè)是私鑰，一個(gè)公鑰。?
私鑰（private key）存儲(chǔ)于客戶端，公鑰（public key）則被發(fā)送到服務(wù)器。公鑰可用于之后驗(yàn)證用戶的客戶端證書（client certificate）。?
目前，瀏覽器對(duì)此元素的糟糕的支持度不足以使其成為一種有用的安全標(biāo)準(zhǔn)。?
代碼如下:
<form action="demo_form.asp" method="get">?
Username: <input type="text" name="usr_name" />?
Encryption: <keygen name="security" />?
<input type="submit" />?
</form>?
output 元素?
output 元素用于不同類型的輸出，比如計(jì)算或腳本輸出：?
代碼如下:
<output id="result" onforminput="resCalc()"></output>?
實(shí)例：
<!doctype html> <html> <head> <meta charset="utf-8"> <title>php.cn</title> </head> <body> <form action="demo_keygen.php" method="get"> 用戶名: <input type="text" name="usr_name"> 加密: <keygen name="security"> <input type="submit"> </form> </body> </html>
<!doctype html> <html> <head> <meta charset="utf-8"> <title>php.cn</title> </head> <body> <form action="" id="myform" oninput="num.value=parseInt(num1.value)+parseInt(num2.value)"> <input type="number" id="num1">+ <input type="number" id="num2">= <output name="num" for="num1 num2"></output> </form> </body> </html>
