使用jQuery隐藏输入文本

-2

如何在输入文字时显示符号（*）而不是字母的jQuery脚本。文本输入的值不应改变，只能显示可见的文本。使用jQuery隐藏输入文本

输入类型的密码不是一个选项，因为我想让它可以通过点击一个按钮再次看到原文。此外，谷歌浏览器中的密码输入是自动完成的，在这种情况下，我不希望它自动完成。

2016-11-06 Silver Boy

只需设置你的输入域'password'的默认类型，并有你的按钮切换password'和'text'之间'你的输入类型。向您的字段添加一个“autocomplete”属性，并将其设置为“false”。 – ifvictr

我之前发布了关于自动完成的问题，结果发现无论您做什么，某些版本的Chrome仍然不会自动完成。但是感谢密码和文本类型交换的想法。 –

不幸的是，这是Chrome的一项功能。一个问题在这里发布了一段时间：https://stackoverflow.com/questions/12374442/chrome-browser-ignoring-autocomplete-off – ifvictr

您应该使用password现场，为现场

document.getElementById("fooVisible").addEventListener("change", function() { 
 
    if (this.checked) { 
 
    \t return document.getElementById("foo").setAttribute("type", "text"); 
 
    } 
 
    document.getElementById("foo").setAttribute("type", "password"); 
 
})

<input type="password" id="foo" autocomplete="false" /> 
 
Show: <input type="checkbox" id="fooVisible" />

来源

2016-11-06 17:30:15 baao

我试图把自动补全。它不起作用，但jQuery代码完美地工作。谢谢。 –

我认为代码可能会更好。使用三元运算符会更好：'document.getElementById（“foo”）。setAttribute（“type”，this.checked？“text”：“password”）;' – ifvictr

@Silver Boy这里没有jQuery。这是所有的JavaScript。 – TheValyreanGroup

你可以存储在一个变量的值，并用星号代替所有字符集text/password之间autocomplete="false"和切换。这不会处理删除或退格，但如果这是您想要的方式，这应该能让您朝着正确的方向前进。

$(document).ready(function(){ 
 
    var textValue = ""; 
 
    $('.asteriskInput').keypress(function(e){ 
 
    var textLength = $(this).length; 
 
    textValue += e.key; 
 
    $(this).val($(this).val().replace(/[A-Za-z]/g,'*')); 
 
    
 
    }); 
 
    $('#changeInputView').on('click',function(){ 
 
    $('.asteriskInput').val(textValue); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<input class="asteriskInput" type="text" /><br /> 
 
<button id="changeInputView">Show characters</button>

来源

2016-11-06 17:59:37 TheValyreanGroup

对于一个非常小的问题，这是一个非常复杂的解决方案......他只是希望隐藏文本，而不是用星号替换。 – ifvictr

是的，但他的要求是不使用密码输入。取代它是唯一的方法。 – TheValyreanGroup

他只是不想使用'password'类型，因为他希望能够显示按下按钮时键入的实际字符。他不知道你可以在'text'和'password'之间切换。问题作者已经接受了完成这个的答案，并且已经接受了我的评论。 – ifvictr

使用jQuery隐藏输入文本

回答

相关问题