注意:如果您正在实施文本安全功能,我已经开发了一个jQuery插件来实现这一目标.
我正在使用text-security样式输入:
input.square-password {
-webkit-text-security: square;
}
在不支持的Web浏览器中,text-security只显示密码(没有星号(****)).
我期待通过使用text-security何时可用或使用标准星号来降低不支持它们的浏览器的此功能.
输入HTML是:
<input class="square-password textbox" name="paymentpassword" />
我尝试添加一个type="password"attr:
<input type="password" class="square-password textbox" name="paymentpassword" />
但它text-security甚至会覆盖支持它的浏览器.
任何解决方法？是否可以通过输入设置星号CSS(无类型="密码")？
编辑:文本安全似乎只有webkit支持.
编辑2:设置为type="password"无法使用文本安全性设置的输入.甚至没有!important(type ="email")
编辑3: @ryan答案工作正常:
这很快又脏,但它确实有效.
<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在这里.