JavaScript密码输入临时可见功能实现
输入框里密码动态显示再自动隐藏的功能,挺适合提升用户体验的,尤其是在你输密码老输错的时候。它的实现其实不复杂,主要就是在监听键盘事件的同时,临时把type="password"
改成text
,等个两三秒再改回来就行。安全性方面嘛,要控制好时间,不要太长,也别同步显示在多个设备上。
监听键盘的keydown
和keyup
事件是关键,能帮你抓住每次用户的输入动作。你可以用setTimeout
做一个延迟,短暂展示密码,过会儿又变回星号,操作上挺丝滑的。
视觉反馈也别忽略,比如临时显示密码的时候,改个边框颜色或加个图标提示,用户体验会更完整。再细一点,还可以加个用户自定义选项,比如“密码显示多久”之类,灵活性更高。
不过提醒一下,虽然这个功能好用,在公共场合还是要小心。别让密码太长时间暴露在屏幕上,尤其是旁边有人盯着看的时候。
下载地址
用户评论