javascript - 在文本框中键入文本时替换文本框中的部分文本

Question

文本框中的文字格式是这样的:

login -u username -p password

在键入此文本时，我想用等于其长度的“*”数量替换“密码”。所以如果我输入:

'login -u abc@abc.com -p abc' 在文本框中应该显示如下:

login -u abc@abc.com -p ***

而且我还需要存储被替换的实际密码。

有什么办法吗？提前谢谢你

Answer 1

您应该使用正则表达式解析输入值，即

<input type="text" id="inputText" />
<input type="hidden" id="actualPassword" /> <!-- Another element to store actual password -->
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
// Function to repeat string n times */
var StringUtilities = {
    repeat: function(str, times) { 
       return (new Array(times + 1)).join(str);
    }
};
$(function(){
    $('#inputText').keyup(function(){ 
        var test = /(login[\s]+\-u[\s]+[a-zA-Z0-9@\.\s]+\-p[\s]+)(.*)/i.exec( $(this).val() ); //'login -u user123 -p password123'      
        if(test !== null)
        { 
            if( $('#actualPassword').val().length < $.trim(test[2]).length )
                $('#actualPassword').val( $('#actualPassword').val() + test[2].slice(-1) );
            else
                $('#actualPassword').val($('#actualPassword').val().slice(0, test[2].length));

          $(this).val( test[1] + StringUtilities.repeat( '*', test[2].length) );     
        }
    });
});
</script>

JS fiddle : http://jsfiddle.net/nmx04h1o/3/