HTML5 新的表單元素
本章介紹以下新的表單元素:
•datalist
•keygen
•output
瀏覽器支援
Input type IE Firefox Opera Chrome
##datalist No No 9.5 No 10.5 3.0 No
datalist 元素
datalist 元素規定輸入域的選項清單。 清單是透過 datalist 內的 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 元素永遠都要設定value 屬性。
keygen 元素
#keygen 元素的功能是提供驗證使用者可靠的方法。
keygen 元素是金鑰對產生器(key-pair generator)。當提交表單時,會產生兩個鍵,一個是私鑰,一個公鑰。 私鑰(private key)儲存於客戶端,公鑰(public key)則傳送到伺服器。公鑰可用於之後驗證使用者的客戶端憑證(client certificate)。 目前,瀏覽器對此元素的糟糕的支援度不足以使其成為有用的安全標準。 程式碼如下:
<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>##########