注意:如果您正在实施文本安全功能,我已经开发了一个
jQuery plugin来完成此任务.
我正在使用文本安全来设置输入样式:
input.square-password { -webkit-text-security: square; }
在不支持文本安全性的Web浏览器中,只显示密码(没有星号(****)).
我期待在不支持它们的浏览器上降级此功能,在可用时使用文本安全性或使用标准星号.
输入HTML是:
<input class="square-password textBox" name="paymentpassword" />
我尝试添加一个type =“password”attr:
<input type="password" class="square-password textBox" name="paymentpassword" />
但它甚至会在支持它的浏览器上覆盖文本安全性.
有任何变通方法吗?是否可以通过CSS(无类型=“密码”)将输入的星号设置为输入?
编辑:文本安全似乎只有webkit支持.
编辑2:设置为type =“password”的输入无法使用text-security设置样式.甚至没有!important(type =“email”)
编辑3:@ryan答案工作正常:
> Firefox
> Chrome
>歌剧
解决方法
这很快又脏,但它确实有效.
<html> <head> <style> input{ -webkit-text-security:square; text-security:square; } </style> <script> window.onload = function(){ init(); } function init(){ var x = document.getElementsByTagName("input")[0]; var style = window.getComputedStyle(x); console.log(style); if(style.webkitTextSecurity){ //do nothing }else{ x.setAttribute("type","password"); } } </script> </head> <body> <div id="di"> <input/> </div> </body>
在chrome和firefox中测试过,我在linux上,所以我无法在IE中测试. Jsfiddle here.