一、autocomplete介绍

autocomplete是Html5中的新属性。
该属性规定输入字段是否应该启用自动完成功能。自动完成允许浏览器预测对字段的输入。当用户在字段开始键入的时候,浏览器基于之前输入过的值,应该显示出在字段中填写的选项。
该属性适用于<form>,以及下面的<input>类型。text,search,telephone,email,password,datepickers,range以及color.
该属性有两个值,on和off。
on是默认的,规定启用自动完成功能。
off是规定禁用自动完成功能。

二、有关autocomplete = "off"失效

做项目的时候,有这个固然方便。但是当我们做用户的找回密码这样的时候,或者重置密码的时候,有这个就显得不是那么好了。
当input的type为text的时候,autocomplete是乖乖的听话的。但是当是paddword的时候,发现并没有起作用。还是会提示密码。这时候上网查了查方法,自己也试了。接下来总结一下。

1.先设置属性readonly,然后在点击那个元素的时候,再把readonly设置为false。我使用的是这种方法解决的。

html代码

<input type="password" readonly="true" class="pwd" autocomplete="off">

js代码(假设引入了jquery)

$(".pwd").on("click", function () {
$(this).attr("readonly", false)
})

2.先设置其type为text,单点击的时候,再把其type改为password

html代码

<input type="text" readonly="true" class="pwd" autocomplete="off">

js代码(假设引入了jquery)

$(".pwd").on("click", function () {
$(this).attr("type", "text")
})

3.可以先写好一个type为text的input框,写一个type为password的input框。但是这个时候这个密码框是隐藏的。当点击文本框的时候。让文本框消失,密码框显示。其实思路和上面是一样的。

4.看网上还有一种说法,是把autocomplete的值写为'new-complete'。网易登陆邮箱就是这样写的。但是这个方式我实验了以后,是不可以的。你们可以试试哦~

有关表单autocomplete = "off" 失效问题解决方案的更多相关文章

  1. 清空表单 autocomplete="off"

    清空表单 autocomplete="off" <form action="/sm/baziqiming.aspx" method="post& ...

  2. 2018/1/8 学习汇总,kettle简单介绍,集合遍历方式的选择及原理,防止表单重复提交的后台解决方案

    昨天因为当前这个二次开发项目的接近尾声,要求我们将生产环境数据库里的数据迁移到现在新的数据库来,但老数据库里是sqlserver而新数据库则是ORACLE,不仅仅面对着数据库数据类型结构不一致的问题, ...

  3. tomcat server.xml maxPostSize=0 导致 果post表单收不到参数解决方案

  4. [Swift通天遁地]二、表格表单-(14)实时调整表单元素的激活和失效

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

  5. HTML5学习系列之表单与文件

    article元素 article元素代表文档.页面或应用程序中独立的.完整的.可以独自被外部引用的内容.它可以是一篇博客或报刊中的文章.一篇论坛帖子.一段用户评论或独立的插件,或者其他任何独立的内容 ...

  6. 防止Web表单重复提交的方法总结

    在Web开发中,对于处理表单重复提交是经常要面对的事情.那么,存在哪些场景会导致表单重复提交呢?表单重复提交会带来什么问题?有哪些方法可以避免表单重复提交? 表单重复提交的场景 1.场景一:服务端未能 ...

  7. summernote富文本编辑器配合validate表单验证无法进行表单提交的问题

    1.使用summernote富文本编辑器提交图片到服务器 在使用bootstrap中,我们用到了summernote富文本编辑器,使用summernote将图片上传到服务器中,参考我的上篇文章http ...

  8. 表单编辑时el-form的validate方法执行无效,阻塞代码运行 - Element UI踩坑记录

    今天在用element-ui写管理后台需求时,遇到一个奇怪的问题 一个正常带校验的表单,在新增列表数据时表单校验功能正常: 但是在新增之后再去编辑数据时,表单校验却失效了,甚至阻塞了后续的代码执行,控 ...

  9. 【antd】form表单默认值设置

    问题: 在antd的form表单的api里面有个"initialValues"可以设置默认值.但是表单没有更新 <Form name="test" for ...

随机推荐

  1. LeetCode-038-外观数列

    外观数列 题目描述:给定一个正整数 n ,输出外观数列的第 n 项. 「外观数列」是一个整数序列,从数字 1 开始,序列中的每一项都是对前一项的描述. 你可以将其视作是由递归公式定义的数字字符串序列: ...

  2. python实现四则运算题库

    #主函数(main.py) from generator import Ari_Expression from infixTosuffix import infix_to_suffix import ...

  3. mysql卡顿问题查找和解决方法

    mysql卡顿问题查找和解决方法 版权一.所遇问题        写在前边的废话:今天面试阿里的时候问到过类似问题,以前做调优的时候都是现查现用,缺乏总结,面试时答得也不好,今天趁此机会做一个梳理,知 ...

  4. PC微信聊天记录数据迁移恢复

    PC微信聊天记录数据迁移恢复   本文章仅仅是PC微信聊天记录从一台电脑迁移到另外一台电脑恢复办法,主要适用于更换电脑,或重装系统,用户想保存PC微信中数据和文件. 1.查看微信记录的保存文件夹 设置 ...

  5. Kubernetes系列(五) Ingress

    作者: LemonNan 原文地址: https://juejin.im/post/6878269825639317517 Kubernetes 系列 Kubernetes系列(一) Pod Kube ...

  6. VuePress 博客优化之增加 Vssue 评论功能

    前言 在 <一篇带你用 VuePress + Github Pages 搭建博客>中,我们使用 VuePress 搭建了一个博客,最终的效果查看:TypeScript 中文文档. 本篇讲讲 ...

  7. ArcMap线上均匀生成点

    面中均匀生成点方法: [创建渔网]→[要素转点](或[要素折点转点])→[裁剪](或[按位置选择]→[导出数据]),即可. ArcMap中随机生成点: [随机生成点]工具 最近博主的朋友有均匀布点的需 ...

  8. TypeScript方法的定义

    在 JavaScript 中,有两种方式定义方法. 1.命名的方法 function add(x,y){ return x+y;}2.匿名方法 var myAdd = function(x,y) { ...

  9. Windows10 1809版本Windows自动更新服务无法禁用问题解决方案

    症状 Windows Update服务已经在服务管理器中禁用,但是莫名奇妙的会被自动设置为手动,并会自动下载补丁.原因 微软加强了系统更新服务的保护措施,导致按照原有的禁用服务方法,能够随时被恢复.解 ...

  10. 4月8日 python学习总结 模块与包

    一.包 #官网解释 Packages are a way of structuring Python's module namespace by using "dotted module n ...