介绍输入::-ms-clear{显示:没有;}
输入:-ms-reveal{显示:没有;}
这篇文章给大家分享的是有关JavaScript实现密码可见性切换的方法的内容。小编觉得挺实用的,因此分享给大家做个参考。一起跟随小编过来看看吧。
前端密码可见性切换(显示和隐藏)效果,大家估计都见过,所以就不多说了。
默认情况下,输入的密码的输入标签类型=皃assword",默认密码用小点或星号表示。要密码可见所以我们需要将类型修改为“text"在Chrome, FireFox等浏览器中通过修改输入标签的类型属性轻松实现该效果,但是IE下就会报错。如果你需要兼容即就必须考虑其他方案。
这里有几点需要说明的是:
示例使用了替换整个输入标签方案,所以可以兼容即
眼睛的图表使用了iconfont,这样使用CSS切换比较简单。
在IE10 +浏览器中,遇到密码输入框的时候,框内会自行显示一个小眼睛的图标,点击后也能显示密码,如果是普通文本输入框,则IE10会自动显示一个小叉,点击后可以清空文本框已输入的内容,如果不想要IE10自带的这两个功能生效,可以在CSS里加入:
CSS代码:
这两个针对IE浏览器的CSS定义便可去掉IE浏览器自动显示的文本清除和显示密码的功能。
感谢各位的阅读!关于JavaScript实现密码可见性切换的方法就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到吧!
