是否有任何跨浏览器的方式来获取
<input type="password">例如，OSX 上的 Chrome、Firefox 和 Safari 使用 •，而 iOS 7 上的 Safari 使用 ●。也许其他浏览器可能会使用老式的 * - 我不知道。
这个问题好像之前也有人问过。请查看更改 HTML 中的密码字符，其中指出无法完成。
快速搜索表明，它可以通过 JS 通过伪造来完成，并且不能在常规密码字段上完成，因为它是由浏览器定义的。参考http://www.htmlforums.com/showpost.php?p=655392&postcount=4
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
var k=0;
var df;
window.onload=function() {
df=document.forms[0];
df[1].onkeyup=function() {
df[0].value+=df[1].value.charAt(k);
k++;
for(c=0;c<df[1].value.length;c++) {
df[1].value=df[1].value.replace(df[1].value.charAt(c),'#');
}
}
}
</script>
</head>
<body>
<noscript>
<div>
Without javascript enabled you will be unable to login
</div>
</noscript>
<form action="http://www.google.com/">
<div>
<input type="hidden" name="password">
<input type="text">
<input type="submit" value="submit password">
</div>
</form>
</body>
</html>
这是一个带有样式和处理的完整实现。我希望你喜欢它:)
function showHidePassword(passSelector, textSelector) {
if ($(passSelector).hasClass("hidden")) {
$(passSelector).val($(textSelector).val());
$(textSelector).addClass("hidden");
$(passSelector).toggleClass("hidden");
}
else {
$(textSelector).val($(passSelector).val());
$(passSelector).addClass("hidden");
$(textSelector).toggleClass("hidden");
}
}.hidden{
display:none !important;
}<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<div class='card'>
<div class='card-body'>
<div class='input-group'>
<div class='input-group-prepend'>
<span class='input-group-text'>
<i class='fa fa-key'></i>
</span>
</div>
<input type='password' id='password' class='form-control'/>
<input type='text' class='form-control hidden' id='passwordContent' disabled/>
<div class='input-group-append'><span class='input-group-text' onclick='showHidePassword("#password","#passwordContent")'><i class='fa fa-eye'></i></span></div>
</div>
</div>
</div>