標籤：html5 log alt val ihe oat 用法 app 文章
新的課程又開始，哈哈，最近的文章更新比較快，希望大家跟上俺的步伐啊，呵呵，但是每當看到閱讀量，哎，還真不多，可是俺還要堅持寫下去，不知道，大家是不是都沒有在研究HTML5呢？
這節課程，講的是 From 表單 新增加的幾個新的元素，他和前面的兩節課程 同屬於一個範圍，只不過長的比較特殊。所以就提煉出來了。
旁白：俺不是前端工程師啊，學習HTML5完全是因為，哈哈，這個東西太酷了。俺是正宗滴NET程式員
好了第一個出現的新元素是 datalist 哈哈，這個好解釋了，前面我們已經使用過了。
還是用一個例子說明吧
<input type="text" name="favfruit" list="fruits"> <datalist id="fruits"> <option value="apple" label="蘋果"> <option value="pine" label="菠蘿"> <option value="tangerine" label="橘子"> </datalist>
option 元素永遠都要設定 value 屬性。
第二個是
output 元素目前這個元素，我們還沒發現那個瀏覽器支援。希望大家測試成功了沒告訴我一下
給大家一段代碼，大家，研究一下吧。
<!DOCTYPE HTML><html><head><script type="text/javascript"> function add() { var o = document.getElementById("result"); var num1 = document.getElementById("num1"); var num2 = document.getElementById("num2"); o.value = parseFloat(num1.value) + parseFloat(num2.value); } </script><head><body><input name="num1" type="number" /> +<input name="num2" type="number" /> =<output name="result" for="num1 num2"></output><button onclick="add()">相加</button></body></html>主要注意下面的用法。
<output name="result" for="num1 num2"></output>
下面的這種用法，就是常見的用法了，大家主要記住下面的用法就可以了
<!DOCTYPE HTML><html><body><form action="" id="numform"><input name="numa" type="number"> +<input name="numb" type="number"> =</form><output name="result" form="numform" onforminput="value=numa.valueAsNumber + numb.valueAsNumber"></output></body></html>
具體的效果我就不深究了，瀏覽器太不給面子了，竟然不支援。
好了，這節課，在我的鬱悶聲中~~~~~~~~~~~結束了，大家慢慢的熟悉一下上面的代碼，就可以瞭解 這兩個標籤的用法了
BYE BYE
跟KingDZ學HTML5之十一 HTML5 Form 表單新元素
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
