Javascript “想要脱衣舞”@email.com“；当用户错误地将完整电子邮件地址包含为用户名时从输入

我的公司有一个登录页面，我们收到许多来自客户的支持电话，因为他们认为他们的用户名是他们的完整电子邮件地址（用户）_id@email.com). 用户名实际上是电子邮件地址@符号前的第一部分

我不知道从哪里开始。我继承了登录页面的职责，并试图做出改进，但我是一个新手程序员

我可以实现这样的功能吗

user_id.split("@")[0]

如果用户键入“user”，则预期结果为_id@email.com在用户名字段中，当他们单击提交时，只会提交“用户id”。

@VLAZ是正确的

let user_id=”foo@email.com";
user_id=user_id.split（“@”）[0]；
console.log（用户id）有两种可能的方法

可以在表单的前端执行类似的操作
或者，您可以在服务器上的表单验证期间实现一些东西
具体的代码取决于堆栈。但是，服务器选项可能更可靠，因为您还可以检查电子邮件是否对应于正确的客户端域，甚至可以通过电子邮件查找用户名并以这种方式记录它们

根据OP对实施情况的反馈更新版本

<input id="username" type="text" onblur="stripUsername()">
<button type="button">Submit</button>

<script>
function stripUsername() {
  document.getElementById("username").value = document.getElementById("username").value.split("@")[0];
}
</script>



提交
函数stripUsername（）{
document.getElementById（“用户名”）.value=document.getElementById（“用户名”）.value.split（“@”）[0]；
}
user\u id.split（“@”）[0]”为什么不起作用呢？为什么不直接用一条消息警告他们，说你是特别要求用户名，而不是他们的电子邮件？此外，如何保证他们电子邮件中的用户名部分实际上是他们的帐户用户名？我可以有一个用户名
john
，但我的电子邮件可以是
john。doe@dingbat.foo
。只需悄悄删除@。。。服务器上的一部分（为了更好的用户体验）。如果字符串中有
@
字符，则向用户抛出一个错误。在删除“email.com”之前，您还可以检查“email.com”是否是您公司的。谢谢@swhitmore。当点击“登录”按钮时，我会使用onClick、onSubmit或类似的东西来触发这个吗？您建议如何在页面上实现此功能？这实际上取决于提交的处理方式。这只是一个带有javascript的普通html或php页面，还是像Reactjs或Angular这样的框架的一部分？您使用的是jQuery还是纯javascript？假设您在常规页面上使用纯javascript，您可以像Matthew建议的那样将拆分封装成一个函数，并在提交之前使用html“onsubmit”属性调用它。@Daniel我更新了我的答案，以反映我在上一条评论中所说的内容。这非常有效。我还有一个问题。我的老板不想让浏览器在用户名的'@email.com'部分保存用户名/密码。即使用户名是用“@email.com”部分保存的，代码仍然会像应该的那样对其进行剥离，但您知道这样做的方法吗？这可能是特定于浏览器的，可能需要您进行一些实验。我猜它会在删除用户名后提供保存，因为这是“onsubmit”属性的结果。谢谢@Matthew。我确实喜欢简单。我只是不知道如何在页面上实现这一点。当我在控制台中运行该命令时，它会像它应该的那样输出“user”，但如何告诉表单输出用户在username字段中键入了什么。@Daniel尝试类似于上面的方法。我编辑了我的答案来解释你的问题。
<input id="username" type="text" onblur="stripUsername()">
<button type="button">Submit</button>

<script>
function stripUsername() {
  document.getElementById("username").value = document.getElementById("username").value.split("@")[0];
}
</script>