HTML5中的表單： 1.form屬性的改變：傳統(tǒng)的必須要都寫在form內(nèi)，HTML5可以寫在外面，如
<form id="login" action="login.php" method="get"></form><input form="login" type="text" name="username" value="admin"> <br><input form="login" type="submit" name="dosubmit" value="Log in"><form id="login1" action="login1.php" method="get"></form><input form="login1" type="text" name="username" value="admin"><br><input form="login1" type="submit" name="dosubmit" value="Log in">這個分別是提交到login.php與login1.php的兩個表單。 2.新增formaction與formmethod方法： formaction是在提交按鈕內(nèi)重寫form的action屬性， formmethod是在提交按鈕內(nèi)重寫form的method屬性， 如例題，所有按鈕都在同一表單內(nèi)，DOSUBMIT的提交地址不變，為login1.php,ADD的提交到add.php,提交方式為GET，DELETE的提交到delete.php，提交方式為post。
<form id="login1" action="login1.php" method="get"></form><input form="login1" type="text" name="username" value="admin"> <br><input form="login1" type="submit" name="DOSUBMIT" value="Log in"> <br><input form="login1" formaction="add.php" formmethod="get" type="submit" name="ADD" value="add"> <br><input form="login1" formaction="delete.php" formmethod="post" type="submit" name="DELETE" value="delete"> <br>3.新增placeholder 屬性提供可描述輸入字段預(yù)期值的提示信息（hint）。 該提示會在輸入字段為空時顯示，并會在字段獲得焦點(diǎn)時消失。 placeholder 屬性適用于以下的 input 類型：text, search, url, telephone, email 以及 passWord。
<form id="login1" action="login1.php" method="get"></form><input form="login1" placeholder="please input value" type="text" name="username"> <br><input form="login1" type="submit" name="dosubmit" value="Log in"> <br><input form="login1" formaction="add.php" formmethod="get" type="submit" name="dosubmit" value="add"> <br><input form="login1" formaction="delete.php" formmethod="post" type="submit" name="dosubmit" value="delete"> <br>4.新增autofocus 屬性規(guī)定當(dāng)頁面加載時 input 元素應(yīng)該自動獲得焦點(diǎn)。 如果使用該屬性，則 input 元素會獲得焦點(diǎn)。
<form id="login1" action="login1.php" method="get"></form><input form="login1" autofocus type="text" name="username"> <br><input form="login1" placeholder="please input value" type="text" name="username"> <br><input form="login1" type="submit" name="dosubmit" value="Log in"> <br><input form="login1" formaction="add.php" formmethod="get" type="submit" name="dosubmit" value="add"> <br><input form="login1" formaction="delete.php" formmethod="post" type="submit" name="dosubmit" value="delete"> <br>autofocus是bool值true or false，一個表單內(nèi)只能有一個。 5.datalist 標(biāo)簽定義選項列表。請與 input 元素配合使用該元素，來定義 input 可能的值。 datalist 及其選項不會被顯示出來，它僅僅是合法的輸入值列表。 使用 input 元素的 list 屬性來綁定 datalist
<form id="login1" action="login1.php" method="get"></form><input form="login1" list="test" autofocus type="text" name="username"> <br><input form="login1" placeholder="please input value" type="text" name="username"> <br><input form="login1" type="submit" name="dosubmit" value="Log in"> <br><datalist id="test"> <option>one</option> <option>two</option> <option>three</option> <option>four</option> <option>five</option></datalist>下拉列表模樣，同時擁有輸入提示的功能。 6.新增autocomplete 屬性規(guī)定表單是否應(yīng)該啟用自動完成功能。 自動完成允許瀏覽器預(yù)測對字段的輸入。當(dāng)用戶在字段開始鍵入時，瀏覽器基于之前鍵入過的值，應(yīng)該顯示出在字段中填寫的選項。 autocomplete 屬性適用于 form，以及下面的 input 類型：text, search, url, telephone, email, password, datepickers, range 以及 color。
<form id="login1" action="login1.php" method="get"></form><input form="login1" list="test" autofocus autocomplete="on" type="text" name="username"> <br><input form="login1" placeholder="please input value" type="text" name="username"> <br><input form="login1" type="submit" name="dosubmit" value="Log in"> <br><datalist id="test"> <option>one</option> <option>two</option> <option>three</option> <option>four</option> <option>five</option></datalist>autocomplete 通過 on 與 off 控制開關(guān)，可同時與list一起使用。 7.新增input功能 -search:搜索框
search：<input form="login1" type="search" name="dosubmit"> <br>-tel:電話號碼
tel：<input form="login1" type="tel" name="dosubmit" title="only 10 numbers" pattern="^/d{10}$"> <br>這里面：pattern屬性內(nèi)部寫的是正則表達(dá)式，用于寫規(guī)則，title用于錯誤提示 -url:鏈接
url:<input form="login1" type="url" name="urltext">注意正確鏈接寫法是：http://xxx.xxx.xxx,且它會自動檢測并提示。 -email:email
email:<input form="login1" type="email" name="emailtext"><br>同上，它會自動檢測是否含有@符號。 -required 意思是不能提交為空，required 為bool型。
url:<input form="login1" type="url" required name="urltext"><br>email:<input form="login1" type="email" required name="emailtext"><br>-取消判斷：novalidate&formnovalidate（都是bool型） formnovalidate 屬性覆蓋 form 元素的 novalidate 屬性。 如果使用該屬性，則提交表單時按鈕不會執(zhí)行驗證過程。 該屬性適用于 form 以及以下類型的input：text, search, url, telephone, email, password, date pickers, range 以及 color。 標(biāo)準(zhǔn)寫法： formnovalidate=”formnovalidate”
<input form="login1" type="submit" formnovalidate="formnovalidate" name="dosubmit2" value="Log in2"> <br>也可formnovalidate
<input form="login1" type="submit" formnovalidate name="dosubmit2" value="Log in2"> <br>novalidate 屬性規(guī)定當(dāng)提交表單時不對其進(jìn)行驗證。 如果使用該屬性，則表單不會驗證表單的輸入。 novalidate 屬性適用于：form，以及以下類型的 input標(biāo)簽：text, search, url, telephone, email, password, date pickers, range 以及 color。 標(biāo)準(zhǔn)寫法： novalidate=”novalidate”
<form id="login1" novalidate="novalidate" action="login1.php" method="get"> </form>也可novalidate
<form id="login1" novalidate action="login1.php" method="get"> </form>-時間
DateTime:<input form="login1" type="datetime" name="datetime"><br>Date:<input form="login1" type="date" name="date"><br>month:<input form="login1" type="month" name="month"><br>week:<input form="login1" type="week" name="week"><br>time:<input form="login1" type="time" name="time"><br>datetime-local:<input form="login1" type="datetime-local" name="datetime-local"><br>-數(shù)字：number
number:<input form="login1" type="number" name="numbertext" value="50" min="0" max="100" step="5"><br>控件控制最小0，最大100，每次上下調(diào)動為5，當(dāng)小于10或大于100或不為5的倍數(shù)，提交時將提示錯誤
-滑條:range
range:<input form="login1" type="range" name="rangetext" value="50" min="0" max="100" step="5"><br>一個滑條，最左端值為min，最右端為max，期間以5為最小單位
兩者可以結(jié)合使用，如：
number:<input form="login1" id="num" onchange="range.value=value" type="number" name="numbertext" value="50" min="0" max="100" step="5"><input id="range" onchange="num.value=value" type="range" value="50" min="0" max="100" step="5"><br>其中onchange屬性意為：改變后，“xx.value=value”,等號右邊賦值給等號左邊，右邊為本身的值，左邊為另外一個ID的值。在這里先通過文本框的值去改變滑條，后一個是為改變滑條帶動文本框內(nèi)的值改變。
-顏色：Color
color:<input form="login1" onchange="opcolornum.value=value" type="color" name="colorbox"><output id="opcolornum">0</output><br>顏色，點(diǎn)擊后出現(xiàn)調(diào)色盤，選擇后可知選擇的顏色的值，提交后也是提交顏色的值。
-文件：file（寫法與HTML4相同，但是可添加multiple屬性（bool型），變?yōu)椴僮鞫鄠€文件）
file：<input form="login1" multiple type="file" name="filebox"><br>-accept 屬性只能與 input type=”file”配合使用。它規(guī)定能夠通過文件上傳進(jìn)行提交的文件類型。
file：<input form="login1" multiple type="file" ：accept="image/*" name="filebox"><br>8.新增output方法，作用就是輸出
range:<input form="login1" onchange="rangenum.value=value" type="range" name="rangetext" value="50" min="0" max="100" step="5"><output id="rangenum">50</output><br>這里是為滑塊顯示值。當(dāng)滑塊移動后，輸出的值會跟著改變。
新聞熱點(diǎn)
疑難解答
