Question

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

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

Answer 1

您应该使用password字段，设置autocomplete="false"并在字段text / password之间切换

＆＃13;

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

＆＃13;

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

＆＃13;

Answer 2

您可以将值存储在变量中，并用星号替换所有字符。这不会处理删除或退格，但如果你想要这样做，这应该会让你朝着正确的方向前进。

$(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>

使用jQuery隐藏输入文本

2 个答案: