去除浏览器对表单值记忆
今天发现一个 WEB 前端问题,页面中有两个 Radio ,默认是选中第一个的,当选中第二个再刷新浏览器,会发现还是选中的第二个,可断定是浏览器记忆功能问题。
经常做前端的技术人员都知道文本输入框 <input> 有提示上一次提交表单时的输入的值功能,这个就是 Autocompletion
Autocompletion, which was first introduced by Microsoft Internet Explorer, is the browser feature of remembering what you entered in previous text form fields with the same name. So, for example, if the field is named name and you had entered several variants of your name in other fields named name , then autocompletion provides those options in a dropdown. This image shows autocompletion being used in a form field;
如果没有适当的运用 Autocompletion ,则会暴露用户的隐私,比如身份证号,手机号等信息。
解决方法:
<INPUT NAME="name" SIZE=40 AUTOCOMPLETE=OFF >
加 autocomplete="off" 即可 屏蔽浏览器表单默认的记忆功能
<input type="radio" name="testRadio" checked="checked" autocomplete="off"/> test1 <input type="radio" name="testRadio" autocomplete="off"/> test2
百度和 Google 的输入框,输入字母或文字后都会有内容下拉框提示,这就是经典的自动补全,查看源码,会发现文本框上都加了 autocomplete="off" ,此为了屏蔽浏览器表单默认的记忆功能。
参考资料:
http://www.whypad.com/posts/firefox-radio-button-bug/559/
http://fhuan123.iteye.com/blog/1160273
http://www.htmlcodetutorial.com/forms/_INPUT_AUTOCOMPLETE.html