我正在使用contenteditable div而不是输入元素,因为它们在输入框中的样式时更灵活.我只是想知道是否有一种方法可以使输入看起来像一个输入元素,其类型设置为密码,如下所示：
<input type='password'>
我希望这很清楚.谢谢.
解决方法
你必须找到mozilla和co的浏览器特定的CSS设置..但在webkit中它看起来像这样.你还需要通过javascript添加keypress处理程序.
<style>
#password {
-webkit-text-security: disc;
height:20px; width:100px;
-webkit-appearance: textfield;
padding: 1px;
background-color: white;
border: 2px inset;
-webkit-user-select: text;
cursor: auto;
}
</style>
<div id="password" contenteditable="true">yourpassword</div>
<script>
//you could use javascript to do nice stuff
var fakepassw=document.getElementById('password');
//fakepassw.contentEditable="true";
fakepassw.addEventListener('focus',function(e){ /*yourcode*/ },false);
fakepassw.addEventListener('keyup',function(e){ console.log(e.keyCode) },false);
</script>
但无论如何,密码字段只是元素与element.innerHTML =“yourpassword”和element.innerText =“•••••••”的组合元素.
您也可以使用javascript执行此操作并使用“•”填充innerText
