HTML5 新的表單元素
本章介紹以下新的表單元素:?
?datalist?
?keygen?
?output?
瀏覽器支援
Input type ? ? IE ? ?Firefox ? ??Opera ??Chrome
##datalist ? ? ? ? ?No ? ? ?No ? ? ? ? ? 9.5 ? ? ??No ? ? ? ? ? 10.5 ? ? ? 3.0 ? ?No ? ?
datalist 元素?
datalist 元素規(guī)定輸入域的選項(xiàng)清單。?清單是透過 datalist 內(nèi)的 option 元素建立的。 如需把datalist 綁定到輸入域,請用輸入域的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" />?
</datalist>?
提示:option 元素永遠(yuǎn)都要設(shè)定value 屬性。?
keygen 元素?
#keygen 元素的功能是提供驗(yàn)證使用者可靠的方法。?
keygen 元素是金鑰對產(chǎn)生器(key-pair generator)。當(dāng)提交表單時(shí),會產(chǎn)生兩個(gè)鍵,一個(gè)是私鑰,一個(gè)公鑰。?私鑰(private key)儲存於客戶端,公鑰(public key)則傳送到伺服器。公鑰可用於之後驗(yàn)證使用者的客戶端憑證(client certificate)。?目前,瀏覽器對此元素的糟糕的支援度不足以使其成為有用的安全標(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>?
<!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>##########