我们在表单输入框中输入信息,提交表单后,当我们再次进入表单页面,双击输入框时,会出现之前提交的信息,这是因为浏览器一般会记录下输入框之前提交表单的信息。这就是这篇文章要讲的autocomplete.

AutoComplete控件就是指用户在文本框输入前几个字母或是汉子的时候,该控件就能从存放数据的文本或是数据库里将所有以这些字母开头的数据提升给用户,供用户选择,提供方便。

输入框(input,textarea,

select)的AutoComplete的默认值是on,其含义代表是否让浏览器自动记录之前输入的值。

有时用户不希望记录之前输入的值,这时就需要关闭AutoComplete。

1.

我们通过在form表单上加入,或者对一些输入框单独加入,就能达到关闭AutoComplete的目的。

1.1 在form表单上加入.

<form method="post" action="login.php" name="login" autocomplete="off">

form>

1.2 在输入框中加入

<input id="username" type="text" name="username" maxlength="20" autocomplete="off">

2.

但是有一种情况例外,就是表单中有input[type="password"],点击保存密码后,在Chrome浏览器则自动填充了用户名和密码的输入框,而IE和Firefox则不同。为了统一浏览器样式,我们需要就Chrome的问题修改。

提供3钟解决方法

2.1 修改value值

(function(){

if(navigator.userAgent.toLowerCase().indexOf("chrome")

!= -1){

var selectors = document.getElementsByTagName("input");

for(var i=0;i<selectors.length;i++){

if((selectors[i].type !== "submit") && (selectors[i].type !== "password")){

selectors[i].value = "

";

}

}

setTimeout(function(){

for(var i=0;i<selectors.length;i++){

if(selectors[i].type !== "submit"){

selectors[i].value = "";

}

}

},100)

}

})()

2.2 修改disabled属性

(function(){

if(navigator.userAgent.toLowerCase().indexOf("chrome") !=

-1){

var selectors = document.getElementsByTagName_r("input");

for(var i=0;i

if((selectors[i].type !== "submit") && (selectors[i].type !== "password")){

selectors[i].disabled= true;

}

}

setTimeout(function(){

for(var i=0;i

if(selectors[i].type !== "submit"){

selectors[i].disabled= false;

}

}

},100)

}

})()

2.3 removes "name" and "id" attributes

(function(){

if(navigator.userAgent.toLowerCase().indexOf("chrome") != -1){

var selectors = document.getElementsByTagName("input");

for(var i=0;i<selectors.length;i++){

if((selectors[i].type !== "submit") && (selectors[i].type !== "password")){

var input = selectors[i];

var inputName = selectors[i].name;

var inputid = selectors[i].id;

selectors[i].removeAttribute("name");

selectors[i].removeAttribute("id");

setTimeout(function(){

input.setAttribute("name",inputName);

input.setAttribute("id",inputid);

},1)

}

}

}

})()

个人比较推荐第三种方法,通过移除input的name和id来达到效果

chrome 不记录填写值_【转载】禁用自动填表'autocomplete=off'在Chrome 中不起作用...相关推荐

  1. chrome 不记录填写值_使用 chrome-devtools Memory 面板

    Chrome dev-tools 系列文章: QAQ-YS:使用 chrome-devtools Console 面板 QAQ-YS:使用 chrome-devtools Elements 面板 QA ...

  2. chrome 不记录填写值_Chrome 调试技巧

    alert 这个不用多说了,不言自明 console 基本输出 想必大家都在用console.log在控制台输出点东西,其实console还有其它的方法: console.log("打印字符 ...

  3. chrome 不记录填写值_Chrome隐藏技巧,效率党收下

    主持人: 大家好 今天我们的节目,有请到一位不愿透明网名的挨踢君 我们知道挨踢君一直是Chrome的忠实拥趸 那么Chrome到底好在哪里 相比其他浏览器,它又有什么优势呢? 我们来采访一下挨踢君 主 ...

  4. chrome 不记录填写值,Chrome 中使用 onbeforeunload 来提示离开页面时数据是否已保存...

    最简单的写法如下,效果是只要用户在当前页面有任何动作,在页面离开时都会显示确认框. 注意:这里返回的字符串原本是自定义的确认框消息,但现在已经不再支持了,仅显示浏览器默认的提示信息. ```javas ...

  5. 两次结果的绝对差值_多图示例:如何呈现论文结果中的各种图表

    本文根据<Journal of the American College of Cardiology>上曾发表的一篇文章<Making Sense of Statistics in ...

  6. java读取excel某个单元格的值_[转载]Java读取Excel中的单元格数据

    目前网上能找到的读取Excel表格中数据的两种比较好的方案:PageOffice好用开发效率高:POI免费.供大家参考,针对具体情况选择具体方案. 1. PageOffice读取excel impor ...

  7. java double long 取值_由一道题引起的思考? java中 long 和double都是64位。为什么double表示的范围大那么多呢?...

    由一道题引起的思考? java中 long 和double都是64位.为什么double表示的范围大那么多呢? 百度标准答案是这样子的: double是n*2^m(n乘以2的m次方)这种形式存储的,只 ...

  8. 无返回值_只需一步,在Spring Boot中统一Restful API返回值格式与处理异常

    统一返回值 在前后端分离大行其道的今天,有一个统一的返回值格式不仅能使我们的接口看起来更漂亮,而且还可以使前端可以统一处理很多东西,避免很多问题的产生. 比较通用的返回值格式如下: public cl ...

  9. java map 随机取值_随机获取一个集合(List, Set)中的元素,随机获取一个Map中的key或value...

    利用Java提供的Random类.从List或Set中随机取出一个元素,从Map中随机获取一个key或value. 因为Set没有提供get(int index)方法,仅仅能先获取一个随机数后.利用一 ...

最新文章

  1. python中math.ceil是什么意思_python中的数字取整(ceil,floor,round)概念和用法
  2. tomcat安装配置及应用
  3. elastic-job 和 xxl-job 的对比
  4. LeetCode练习及自己理解记录(1)
  5. Java 使用 Timer 进行调度
  6. Opportunity PRODUCT GUID
  7. scala mysql连接池_Java与Scala的两种简易版连接池
  8. 吴恩达深度学习 —— 3.8 激活函数的导数
  9. (十四)面向对象之多态
  10. Netty实现丢弃服务协议(Netty4.X学习一)
  11. 求0-999之间的水仙花数。
  12. ROI坐标点提取(python)
  13. L2-008. 最长对称子串-PAT团体程序设计天梯赛GPLT
  14. Weka数据挖掘平台
  15. Linux之文件基础操作命令
  16. OpenStack之Nova模块
  17. 不加群提取群成员_钉钉群机器人如何快速集成?无需API代码开发对接企业CRM,营销,表单,OA,客服和其他内部系统...
  18. 一套完整的游戏原型设计流程究竟是怎样的?
  19. Android缓冲进度条或加载进度条
  20. 【服务器数据恢复】Storwize系列存储raid5数据恢复案例

热门文章

  1. 第一部分:TCL基本知识
  2. linux用unzip解压.zip文件失败解决方案
  3. [云炬创业学笔记]第二章决定成为创业者测试10
  4. [云炬创业基础笔记]第一章创业环境测试9
  5. [云炬创业基础笔记]第六章商业模式测试24
  6. 生活感悟 2018-06-13
  7. 重磅!花书《深度学习》,这份精炼笔记可能是最全面的
  8. 基于UDP客户端服务器的编程模型-linux网络编程
  9. json的格式和简单例子
  10. Reference和ReferenceQueue