一、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. VS常用的快捷键

    整理代码          Ctrl+k+f 注释                 Ctrl+k+c 取消注释          Ctrl+k+u 帮助文档          F1 无调试启动     ...

  2. laravel 框架简易增删改查

    参看网址:http://www.yan.com/mou/add 图书增加HTML页面 //图书增加路由 Route::get('mou/add','MouController@store'); //控 ...

  3. egg项目eslint不识别链式操作符的解决方法

    项目用到链式?.结果eslint一直提示 const permissionHandleArr = positionPermissionHandle.map(item => item.permis ...

  4. kkFileView对接svn服务完成文件在线预览功能

    1.需求: 之前在公司内部搭建了svn服务器,给部门存放文档.视频,做成了一个文档服务器来用,随着视频文件太大,每次下载太慢 需要把文件在线打开查看 2.解决: kkFileView https:// ...

  5. 腾讯2021LIGHT公益创新挑战赛赛题分析

    前些日子老师让我们报名了LIGHT挑战赛,之后又简单的进行了分析,今天我总结复盘一下,一是为了捋一下自己选题的思路,二是以后遇见类似的项目,更容易找到方向或者触类旁通. 赛题介绍 赛题一:安全教育/保 ...

  6. python 关于heapq模块的随笔

    heapq模块提供了很多高级功能可以通过help(heapq)查看详细文档: 要点: 1优先级队列让我们可以按照重要程度来处理元素,而不是先进先出 2使用heapq可以应对长列表,因为heap不是复杂 ...

  7. BUU [GKCTF 2021]签到

    BUU [GKCTF 2021]签到 1.题目概述 2.解题过程 追踪HTTP流 在下面发现了一串可疑字符 Base16转base64 放到010里看看 复制下来,去转字符 好像不是,再回去找找其他的 ...

  8. WPF 文本描边+外发光效果实现

    解决思路: (1)描边效果可以将文本字符串用GDI+生成Bitmap,然后转成BitmapImage,再用WPF的Image控件显示. (2)外发光效果用WPF自带的Effect实现 代码: 1 us ...

  9. ansible 三配置和命令集

    一.Ansible配置 Ansible安装好之后的配置文件有如下两种: 1.yum安装,配置文件默认路径为: /etc/ansible/ansible.cfg 2.源码包安装,配置文件路径需要从软件包 ...

  10. 配置Django环境后,运行时报错

    (背景)安装完Django,并配置完成. 在setting.py中设置了数据库时,出现的报错. 点击查看 数据库配置 DATABASES = { 'default': { # 'ENGINE': 'd ...