更改表单（输入）值而不显示用户

Question

我有一个包含用户名和密码输入字段的表单。在提交之前，我想在用户名后附加一个字符串：“ _ test”。我想这样做，但是在用户不知道/看不到这一变化的情况下。

function func(form){

   var userName = $("#username").val() + "_test";

   $("#username").val(userName);

   return true;

}

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

<form id="formtest" name="formtest" action="" method="post" onsubmit="return func(this)" >

   <input name="username" type="text" autofocus id="username"> 

</form>

如果我这样做，并且用户输入“ Albert”，则用户名将在提交表单之前短暂更改为“ Albert_test”，并且用户会注意到其用户名已更改，我不希望这种情况发生。我希望可见的用户名保持“ Albert”，但我希望提交“ Albert_test”。

一个例子; https://codepen.io/anon/pen/MRGmyQ 如您所见，如果您单击按钮“ _test”，则会添加该内容，但我不希望用户看到/注意这一点。我该怎么做？

编辑：人们问为什么我不做这个服务器端。如果我对服务器端有任何控制，那确实是一件轻而易举的事，不幸的是，我只能对前端进行更改。