對於某些密碼,想要在手機上調出數字鍵盤,同時要隱藏文字。可結合type=tel和 text-security屬性達到目的。
input{
-webkit-text-security:disc;
text-security:disc; /*使用指定形狀代替文字顯示 circle圓圈 disc 圓形 square 正方形*/
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>輸入密碼時,調出手機的數字鍵盤</title>
<style>
input{
-webkit-text-security:disc;
text-security:disc; /*使用指定形狀代替文字顯示 circle圓圈 disc 圓形 square 正方形*/
}
</style>
</head>
<body>
<input type="tel" id="pass" />
<script>
window.onload = init;
function init(){
var x = document.getElementById("pass");
var style = window.getComputedStyle(x);
if(style.webkitTextSecurity){
//do nothing
}else{
x.setAttribute("type","password");
}
}
</script>
</body>
</html>
