HTML5 新表單元素
HTML5 新的表單元素
#<datalist>
#< keygen>
<output>
#注意:不是所有的瀏覽器都支援HTML5 新的表單元素，但是你可以在使用它們，即使瀏覽器不支援表單屬性，仍然可以顯示為常規的表單元素。
<datalist> 元素
#<datalist> 元素規定輸入網域的選項清單。
<datalist> 屬性規定 form 或 input 網域應該要有自動完成功能。當使用者在自動完成網域中開始輸入時，瀏覽器應該會在該網域中顯示填寫的選項：
使用<input> 元素的清單屬性與<datalist> 元素綁定.
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>php中文网(php.cn)</title> </head> <body> <form action="" method="get"> <input list="fruits" name="fruit"> <datalist id="fruits"> <option value="苹果"> <option value="香蕉"> <option value="柚子"> <option value="橙子"> <option value="梨子"> </datalist> <input type="submit"> </form> </body> </html>
運行程式嘗試
<keygen> 元素
<keygen> 元素的作用是提供一種驗證用戶的可靠方法。
<keygen>標籤規定用於表單的金鑰對產生器欄位。
當提交表單時，會產生兩個鍵，一個是私鑰，一個公鑰。
私鑰（private key）儲存於客戶端，公鑰（public key）則被傳送到伺服器。公鑰可用於之後驗證使用者的客戶端憑證（client certificate）。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>php中文网(php.cn)</title> </head> <body> <form action="" method="get"> 用户名: <input type="text" name="usr_name"> 加密: <keygen name="security"> <input type="submit"> </form> <p><strong>注意:</strong> Internet Explorer 不支持 keygen 标签。</p> </body> </html>
把程式放到你的編輯器，本地運行程式試試看
# <output> 元素
## <output> 元素用於不同類型的輸出，例如計算或腳本輸出：
#實例將計算結果顯示在< output> 元素:<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<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>
</body>
</html>
運行程式嘗試一下
| 標籤 | |
| 說明 |
