在文本框中键入文本时，替换文本框中的一部分文本

login -u username -p password

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

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

<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/

您可以使用多个文本框，但仍然可以使其看起来像一个，命令提示符。使用CSS可以删除左右边框，并将它们连接得足够近。在每个文本框的按键事件中，检查用户是否键入了空格，并将焦点更改为下一个文本框。只要您有一些固定格式的输入，这个解决方案就可以工作。

您需要改变查看需求的方式。为什么只需要一个输入就可以从用户那里获取数据？

你需要以不同的方式收集用户名和密码，然后你可以在表单提交中合并相同的用户名和密码。

$("#submit").click(function(){
    $output = "login -u " + $("#username").val() + " -p " + $("#password").val();
    alert($output);
    return false;
});

http://jsfiddle.net/kiranvarthi/j8gL9mvx/1/

不要这样做。你可以在我的答案底部看到我尝试了什么。

我稍微处理了一下这个问题，但当我这样做的时候，我又面临了另一个问题。

有两种方法可以做到这一点。第一，当用户输入字符时，您需要使用keyup函数。

因此，您可以编写一个正则表达式，它捕获-p andsomecharactersherewhileitsnotspace。

好的，第一种方法是捕获用户密码的最后一个字符，并将其连接到一个隐藏字段。我和Apul Gupta试过这个。

出于某种原因，我们的两个代码都把密码搞砸了，因为出于某种原因我不知道，如果你打字要快，就会有*个字符。我试图替换那些*字符，但在这种情况下，密码中的一些字符丢失了。

另一种方法是从keyup事件中获取角色。这很糟糕，因为String.fromCharCode总是返回大写字符，因为，keyup不知道是否发生了SHIFT或CAPS LOCK。也许现在你想，你可以应付，但你做不到。SHIFT很简单，但你不知道CAPS LOCK以前是否打开过。

如果您只允许用户使用小写或大写密码，则可以解决此问题，但这很糟糕，因为会使密码失效。

所以，多想想。比方说，不知何故，我们可以使用其中一种解决方案。然后整个事情变成了一件非常复杂的事情，我认为什么太贵了。因为，你应该处理，如果用户只SHIFT, LEFT ARROW, DELETE密码会发生什么。你需要检查，用按键组合选择了什么，光标在哪里，等等…

我建议你忘记这一点，或者试着找到另一种方法。

Kiran Var这个答案是我认为最好的选择。

我尝试过的：

<input type="text" name="userInput" id="userInput" value="" />
<input type="hidden" value="" name="hiddenPassword" id="hiddenPassword" />
<script type="text/javascript">
    $(function() {
        String.prototype.repeat = function(num) {
            return new Array(num + 1).join(this);
        }
        //46 = delete key
        $("#userInput").keyup(function(e) {
            var match = $("#userInput").val().match(/-p(['s]+)(.+)/i);
            if (e.keyCode === 8) {
                var deleted = $('#hiddenPassword').val().substring(0, $('#hiddenPassword').val().length - 1);
                $('#hiddenPassword').val(deleted);
            } else {
                if (match !== null && match[2] && String.fromCharCode(e.keyCode).match(/[a-zA-Z0-9]/)) {
                    //Alphanumeric
                    $('#hiddenPassword').val($('#hiddenPassword').val() + $("#userInput").val().substring($("#userInput").val().length - 1));
                    $("#userInput").val(($("#userInput").val().replace(/-p (.+)/, "-p " + "*".repeat(match[2].length))));
                }
            }
            if (match !== null && match[2]) {
                console.log("Password is: " + $('#hiddenPassword').val());
            }
        });
    });
</script>