2.3 HTML5中新增的表單元素

2.3.1 datalist元素

datalist元素用于為文本框提供一個可供選擇的列表，用戶既可以選擇列表中的內容，也可以在文本框中輸入內容。如果要把datalist元素綁定到文本框中，應該將文本框的list屬性值設置為datalist元素的id值。datalist元素的列表項由option標簽指定。當需要用戶能夠自由輸入內容又有一些建議選項時可以使用datalist元素，如果選擇了datalist元素中的列表項，則提交表單以后獲取的文本框的值為列表項的值。例如，datalist.html，其顯示效果如圖2-18所示。

datalist.html：

2.3.2 keygen元素

keygen元素是密鑰對生成器，能夠使用戶的驗證更可靠。用戶提交表單時，會生成兩個鍵：一個私鑰，一個公鑰。私鑰會被存儲到客戶端，公鑰被發送到服務器。公鑰可以用來驗證用戶的客戶端證書。但是目前各類瀏覽器對keygen元素的支持狀況并不理想。

2.3.3 output元素

output元素用于在瀏覽器中顯示計算結果或者腳本輸出，包含完整的開始標簽和結束標簽。output元素的for屬性用于定義輸出域相關的一個或多個元素，值為元素的id值，如果是多個元素，則使用空格隔開。form屬性用于指定output元素所屬的一個或多個表單，name屬性為對象的唯一標識，表單提交時用于獲取元素的值。例如，output.html，完成兩個range類型的input元素的值求和，當range類型的input元素的值發生變化或者文本框內的值發生變化時，output元素會顯示二者求和之值，其顯示效果如圖2-19所示。本例中使用了部分JavaScript腳本，關于JavaScript后面會有詳細介紹。

output.html：