什么是HTML5的form自動完成功能垫桂?
首先蜡励,HTML5 中有個新屬性autocomplete 隆圆,autocomplete 屬性規(guī)定表單是否應(yīng)該啟用自動完成功能,它自動完成允許瀏覽器預(yù)測對字段的輸入镀岛。當(dāng)用戶在字段開始鍵入時弦牡,瀏覽器基于之前鍵入過的值,應(yīng)該顯示出在字段中填寫的選項漂羊。
如:
<form autocomplete="on">
First name:<input type="text" name="fname" /><br />
Last name: <input type="text" name="lname" /><br />
E-mail: <input type="email" name="email" autocomplete="off" /><br />
<input type="submit" />
</form>
<p>請?zhí)顚懖⑻峤淮吮韱渭菝蹋缓笾剌d頁面,來查看自動完成功能是如何工作的走越。</p>
<p>請注意椭豫,表單的自動完成功能是打開的,而 e-mail 域是關(guān)閉的旨指。</p>
會發(fā)現(xiàn)赏酥,autocomplete="on"的會被“記錄下來”,而E-mail的autocomplete="off"谆构,再次輸入時不會被“記錄”裸扶。這就是“HTML5中form的自動完成功能”啦!
還不太清楚的可以去w3school手冊繼續(xù)學(xué)習(xí)搬素。
如何關(guān)閉自動完成功能
有時候我們希望關(guān)閉輸入框的自動完成功能呵晨,例如當(dāng)用戶輸入內(nèi)容的時候,我們希望使用AJAX技術(shù)從數(shù)據(jù)庫搜索并列舉而不是在用戶的歷史記錄中搜索蔗蹋。
關(guān)閉輸入框的自動完成功能有3種方法:
1何荚、在IE的Internet選項菜單里的內(nèi)容--自動完成里面設(shè)置
2、設(shè)置Form的autocomplete為"on"或者"off"來開啟或者關(guān)閉自動完成功能
(關(guān)閉整個表單(form)自動提示功能)
3猪杭、設(shè)置輸入框(input)的autocomplete為"on"或者"off"來開啟或者關(guān)閉該輸入框的自動完成功能(關(guān)閉密碼域的自動完成)
測試代碼:(在每個form輸入文字然后提交,然后再回來看看能否自動完成妥衣,注意要提交后才能有歷史記錄皂吮,才可能自動完成;提交后頁面可能出錯税手,不用管它蜂筹,后退回去即可)
打開自動完成功能的Form<br>
<form name="form1" autocomplete="on">
打開自動完成功能的輸入框
<input type="text" autocomplete="on" ><br>
關(guān)閉自動完成功能的輸入框
<input type="text" autocomplete="off"><br>
<input type="submit" value="提交"><br>
</form>
關(guān)閉自動完成功能的Form<br>
<form name="form1" autocomplete="off">
打開自動完成功能的輸入框
<input type="text" autocomplete="on"><br>
關(guān)閉自動完成功能的輸入框
<input type="text" autocomplete="off"><br>
<input type="submit" value="提交"><br>
</form>
建議:不要全部關(guān)閉自動完成功能,根據(jù)需要禁用一部分自動完成功能即可芦倒,如果你覺得瀏覽器自帶的自動完成功能還不夠強(qiáng)大艺挪,可以使用jquery插件來實現(xiàn)更加強(qiáng)大的自動提示完成功能。
比如百度搜索框的自動提示功能就非常強(qiáng)大印衔。