javascript 在 html 中屏蔽和取消屏蔽输入文本
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/11204406/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Mask and unmask input text in html
提问by user1482239
I have few text fields like SSN , phone number and email id. I would like to do something like onfocus it should display the whole content of that input box and on blur it should mask the content back to something (say asterix).Thanks in advance
我有几个文本字段,如 SSN、电话号码和电子邮件 ID。我想做一些像 onfocus 这样的事情,它应该显示该输入框的全部内容,而在模糊时,它应该将内容屏蔽回某些内容(比如星号)。提前致谢
回答by Sirko
You could switch the type of the <input>
element between password
and text
in both events. See this example fiddle.
您可以在两个事件<input>
之间password
和text
两个事件中切换元素的类型。请参阅此示例 fiddle。
HTML
HTML
<input type="password" id="target" />
JS
JS
<script>
var inp = document.querySelector( '#target' );
inp.addEventListener( 'focus', function(){
inp.type = 'text';
});
inp.addEventListener( 'blur', function(){
inp.type = 'password';
});
</script>
回答by Nemanja
Try it like this:
像这样尝试:
<input type="text" id="emailId" name="emailId" />
Then, do a:
然后,做一个:
var emailIdValue = "";
$( document ).ready( function() {
emailIdValue = $( '#emailId' ).val();
$( '#emailId' ).val( "********" );
$( '#emailId' ).focus( function() {
$( this ).val( emailIdValue );
} ).focusout( function() {
emailIdValue = $( this ).val();
$( this ).val( '********' );
} );
} );
回答by Rorok_89
You could simply use <input type="password" />
if you want to do it simple.
<input type="password" />
如果你想简单,你可以简单地使用。