Javascript 只接受特定电子邮件域的输入框和充当提交和电子邮件域的按钮

我意识到这个标题很长而且令人困惑，所以让我澄清一下。我正在尝试创建一个注册输入表单，用户在其中注册他们的电子邮件。例如，我只接受某个域名的电子邮件blah@abc.com

我想创建一个输入表单，允许用户键入他们电子邮件的唯一部分，并创建一个按钮作为提交按钮，并添加电子邮件的@abc.com部分。当用户完成键入时，他们可以将鼠标悬停在该按钮上：hover，只有在该按钮悬停后，它才会变成可单击的按钮

简而言之，用户不必输入电子邮件的@whater.com部分

我对编程/web开发相对较新，我知道这项任务将涉及一些Python/Javascript。如果你有时间，让我详细介绍一下如何实现这一目标。提前谢谢

到目前为止，我所拥有的：

欢迎 html{ 溢出-x：自动； 溢出y：自动； } 身体{ 身高：100%； } 包装纸{ 最小高度：100%； 位置：相对位置； } .btn:悬停{ 背景：990100； 光标：指针； 颜色：白色； } .btn默认值{ 字体系列：DecoType Naskh； 填充：15px； 字体大小：15px； 利润率：10px； 字母间距：3px； } 标题{ 背景：透明； 填充：10px； } .包装纸{ 文本对齐：居中； 垂直对齐：中间对齐； } 内容{ 填充：10px； 填充底部：0px；/*页脚元素的高度*/ } .内容{ 垫底：25px； } 琼伯伦先生{ 背景：透明； } .表格组{ 身高：50%； 溢出：自动； 保证金：自动； 位置：绝对位置； 顶部：0；左侧：0；底部：0；右侧：0； } 页脚{ 宽度：100%； 高度：25px； 位置：绝对位置； 背景：透明； 底部：0； 左：0； } .信用卡{ 位置：相对位置； 字体大小：12px； 字体系列：DecoType Naskh； 底部：0； 文本对齐：居中； 字母间距：10px； 边框：3倍实心； 边框颜色：粉红色； 边界半径：10px； }

---

Javascript将是您在这里的最佳选择，因为它是这两种浏览器中唯一运行的。我建议您先学习Javascript的基础知识，然后再继续学习。我懂一点python，python会工作吗？我已经懂一点python了。但是对于输入栏的外观，我需要HTML/CSS，不是吗？函数的Python。不能在浏览器中运行Python。有很多方法可以将Python编译成Javascript，但最终您必须使用JS来执行任何动态操作。你仍然需要像上面那样的HTML/CSS来在页面上显示元素，但是JS是唯一可以为你动态更改这些元素的东西。嗯，好的。Codecademy有一个python课程和一个Javascript课程。我已经完成了Python。你建议启动javascript吗？