使用 Element UI 输入框记忆性失效的问题，如何的自动填充

最新推荐文章于 2024-03-19 11:36:27 发布
最新推荐文章于 2024-03-19 11:36:27 发布
阅读量1.5k 收藏 6
点赞数 1
分类专栏： vue学习笔记 文章标签： html vue.js elementui
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u011608672/article/details/115622484
版权

问题

在项目的使用过程中，遇到了每次的输入账号都需要手动输入，el-input好像失去了自动填充的功能，就算加上autocomplete原声属性还是不回自动填充，甚是麻烦，然后查询到了，原来是缺少name属性的原因

解决方法

在elment中的el-input中添加name属性，也就是 name 属性的意义并不只是在于提交表单这一方面，他还有一个隐藏属性：“支持表单的记忆功能”！

<el-input v-model="***" placeholder="请输入手机账号" class="el-input-account" autocomplete="on" name="account"></el-input>

两个属性都要有：

autocomplete="on"
name="account"

这样简单就可以了！！！！！！

面对疾风ba
关注
  • 1
    点赞
  • 踩
  • 6
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
专栏目录
el-input如何记忆
weixin_46139110的博客
01-09 703
el-input的记忆功能是指通过添加name属性，可以实现浏览器自动填充表单的功能。当用户在el-input中输入账号信息后，浏览器会将该账号信息保存起来，下次用户再次输入账号时，浏览器会自动填充已保存的账号信息。通过添加name属性，浏览器会将用户输入的账号信息保存起来，并在下次用户再次输入账号时自动填充。
element-ui表单输入框开启记忆功能
热门推荐
csdn_meng的博客
06-22 1万+
<el-form ref="form" :model="formData" label-width="120px"> <el-form-item prop="item1" label="示例1：" :required="true" error="请输入值" > <!-- name 要和 el-form-item的prop 以及绑定的变量名一致 --> <el-input name="item1" auto-comple
去掉el-input输入框弹出历史记录框
最新发布
关
03-19 579
给input 绑定mousedown事件，将input的只读开启后在关闭，就会阻止浏览器的历史记录弹出来。因为mousedown事件阻止了input 的清除，所以使用$set()进行清除。这是mdn给予的解决方案，有的浏览器支持，有的浏览器不支持。1、输入框在输入内容时会下拉展示浏览器的历史数据。
html输入框记忆功能
haiyuhuang的专栏
11-18 1989
<br />input   type= "password "   id= "pw "   autocomplete= "off "> 
Element Input输入框的使用方法
10-15
主要介绍了Element Input输入框的使用方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
vue element-ui实现input输入框金额数字添加千分位
10-15
主要介绍了vue element-ui实现input输入框金额数字添加千分位,本文给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下
element中 el-input 中的 autocomplete 属性怎么使用，为什么不生效
a1783118的博客
11-24 5507
element中 el-input 中的 autocomplete 属性怎么使用，为什么不生效
解决element ui 密码框自动填写问题
m0_61447532的博客
12-29 1565
两个方案 1. 在 el-input中添加 autocomplete= "new-password" // 可能在火狐浏览器或低版本谷歌中失效 2. 在el-input 的上方添加一个html inpue元素， 原因是浏览器会自动找到type为password，且有name值的input并进行自动填写，这里在需要的密码框前再写一个密码框隐藏或者定位到视图外用来接收浏览器的自动补全 <input name="a" style="display: none;" type="password" pl.
el-input auto-complete=“off“不生效
陈庄主的博客
07-28 812
当用在浏览器打开了上述设置时，edge页面的每个input框都会自动打开填充信息，需要从代码层面取消自动填充设置属性；auto-complete="off"有时不生效，设置auto-complete="new-password"即可。
ElementUI之el-input输入不进去解决办法
qq_38769403的博客
04-12 1751
碰到el-input输入失效，怎么填都不响应 原因：嵌套层级太深 解决办法：强制刷新 html： <el-input @input="inputChange"></el-input> js： inputChange(){ this.$forceUpdate(); //强制刷新 }
element-ui中dialog弹窗关闭按钮失效的解决
10-14
主要介绍了element-ui中dialog弹窗关闭按钮失效的解决，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
解决Vue的项目使用Element ui 走马灯无法实现的问题
10-15
主要介绍了解决Vue的项目使用Element ui 走马灯无法实现的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
VUE+Element实现历史搜索
weixin_48604432的博客
09-04 1076
实现历史搜索，主要用到了 localStorage 储存 localStorage 可以长久保存整个网站的数据，保存的数据没有过期时间，直到手动去删除。 引入element的 autocomplete输入框 是一个可带输入建议的输入框组件 <template> <div> <el-autocomplete class="inline-input" v-model="state1" :fetch-suggestions="querySearch" placehold
el-input/input取消浏览器记住密码问题
斗师——Ace
07-22 4946
1.添加auto-complete="new-password"属性，这是一个新属性,兼容所有浏览器. <el-input type="password" auto-complete="new-password" v-model="form.password" placeholder="请输入密码"></el-input> 2.在表单中创建一个不显示的input且...
elementui 隐藏输入框_关于 Element UI 输入框记忆性失效的问题
weixin_39826089的博客
12-23 1522
首先说一个原生的input框默认的是有记忆功能的，而记忆功能在于一个属性— autocomplete ，而这个属性是 HTML5 的一个新属性， 在不支持HTML5的浏览器下是没有用的 。autocomplete 属性规定输入字段是否应该启用自动完成功能。自动完成允许浏览器预测对字段的输入。当用户在字段开始键入时，浏览器基于之前键入过的值，应该显示出在字段中填写的选项。autocomplete=...
【ElementUI样式优化】el-input带自定义查询删除图标 ==＞ 图标点击可实现对应功能 ==＞ 一个input实现查询重置功能
Sabrina_cc的博客
08-03 6779
【ElementUI样式优化】el-input带自定义查询删除图标 ==> 图标点击可实现对应功能 ==> 一个input实现查询重置功能 效果概览：修改el-input样式。外层是框框，内层是input和i，实现点击查询图标查询、点击取消按钮清空form的同时 重置查询结果。...
前端element ui去除表单输入框聚焦有记忆功能提示和去除记忆回填功能
FUFCY的博客
05-24 1064
<el-input v-model="form.name" type=＂text＂ ref="name" name="name" autocomplete="off" @key.enter.native="inputFocus($event)"></el-input> //在methods写 inputFocus(e){ e.target.focus();//聚焦 this.$refs.name.activated = true e.target.blur(); //让输入框失.
解决elementUI 表单输入框浏览器自动填写问题
hsany330的专栏
06-06 2741
所以就有一种折中的解决方案：既然浏览器要自动填充，我们就给一个具有name属性的表单让他填充，再用css的display:none将其在页面中隐藏，这样就巧妙的实现了功能，也完全兼容任何浏览器（基于目前主流浏览器的兼容性，不到万不得已不要用这个方法）。如果一个网站为 设置了autocomplete=“off”，表单中包含用户名和密码字段，浏览器仍会为这次登录提供记忆功能，并且如果用户同意，用户在下一次访问网站时，浏览器会自动填写这些字段。当用户再次访问这个网站时，浏览器使用保存的值自动填写登录字段。
element ui 输入框无法删除
09-09
你好，对于 Element UI 输入框无法删除的问题，可能有几种原因导致。下面是一些常见的解决方法，您可以尝试一下： 1. 检查输入框的绑定值是否正确：请确保输入框的 v-model 绑定的值正确地与数据源绑定，以便能够...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值