尝试获取输入 1 的前 5 个字符和输入 2 的第一个字符

Trying to get the first 5 characters of input 1, and first character of input 2

我正在尝试根据我们使用的现有手动公式为用户生成用户名:姓氏的前 5 个字符,名字的首字母。

简单:

$("#first_name, #last_name").keyup(function(){
    var a = $("#first_name").val().substring(0, 1),
        b = $("#last_name").val().substring(0, 5);

    $("#username").val(b+a);
});

不过,我一直在想办法找出姓氏少于5个字符时的规则,然后用名字的下一个字母填充那些缺失的字符。最后如果名字+姓氏加起来少于5个字符,就加上。

这与我正在努力的方向一致,但没有奏效,我似乎无法理解原因:

$("#first_name, #last_name").keyup(function(){

    var a = $("#first_name").val(),
        b = $("#last_name").val();

    if( b < 5 ) {

        var c = ( 5 - b.length );

        if( c > a.length ) {
            var d = a.substring(0, c);
            $("#username").val( b + d );
        } else {

            $("#username").val( b + a );
        }

    } else {

        $("#username").val( b + a );

    }       
});

如果姓氏小于5,将两者连接起来取前6。

如果姓氏大于5,则取姓氏的前5位加上名字的第一个字符。

$("#first_name, #last_name").keyup(function(){
    var a = $("#first_name").val().trim().toLowerCase().replace( / /g, ''),
        b = $("#last_name").val().trim().toLowerCase().replace( / /g, ''),
        c = '';
    
    if (!a || !b) return;
    
    if ( b < 5 ) {
        c = (b + a).substring(0, 6);
    } else {
        c = b.substring(0, 5) + a[0];
    }
    
    $("#username").val( c );
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" value="" id="first_name" placeholder="First Name">
<input type="text" value="" id="last_name" placeholder="Last Name">
<div><input type="text" id="username"></div>

I have been trying to figure out the rules...

这里的关键是姓氏。您只有2个案例,这取决于姓氏长度。

当你知道它少于 5 个字符时。按原样使用!
并使用它的长度来计算从名字中使用多少个字符。

$("#first_name, #last_name").keyup(function(){

  var a = $("#first_name").val(),
      b = $("#last_name").val();

  // Last name longer than 5 chars
  if( b.length >= 5 ) {
    a = a.substr(0,1);
    b = b.substr(0,5);
    
  // Last name shorter than 5 chars
  }else{
    a = a.substr(0,(5-b.length+1));  // That is at least 1 + 5 possible "replacements"...
  }

  $("#username").val( b + a );

});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

First name: <input type="text" id="first_name"><br/>
Last name:  <input type="text" id="last_name"><br>
username: <input "type="text" id="username">