通过HTML验证（RegEx）验证电子邮件中的域

Question

我有一个登录表格。 在这里，我希望HTML验证在用户名输入中输入的电子邮件地址。 但是，这是我无法执行的部分，我希望它验证电子邮件应仅属于特定域。 例如-仅允许使用带有@ mysite.ae的电子邮件。 我知道可以使用RegEx来完成，但不确定如何在我的情况下实现

 <div class="signInInputLabel" id="userNameLabel" aria-hidden="true"> Username: </div> <div> <input id="username" name="username" class="signInInputText" type="email" required> </div> <div class="signInInputLabel" id="passwordLabel" aria-hidden="true">Password:</div> <div> <input id="password" onfocus="g_fFcs=0" name="password" value="" type="password" class="signInInputText" aria-labelledby="passwordLabel" required /> </div> <div class="signInEnter"> <div class="signinbutton" role="button" tabIndex="0"> <button type="submit" style="background-color:Transparent; background-repeat:no-repeat; height:25px; border: none; cursor:pointer; overflow: hidden; outline:none;" class="signinTxt"> <img class="imgLnk" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8++IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7MvF4iAAACF0lEQVR42qyVz0sCQRTHZ5cSuqQJURRUt66GEuQlugmF0Ukw+huCjaBT0SkhEvwL6iQEERRJndIuCoLU1VsFQkH04xR0se/D79C4qLtCDz47zO6b7755M2/GUk5ZdbEwSIEEmAQRvn8ADXADTptHC++dBlsdhIfAJtgBQdXbvkAG5PCDb/OD7XIcByVwQNFLsA5iYJDE+O6SPuJbsrYq490ilulKZwrUwB4oeES8DPZBFDyDOCJvmBEHwDlFC8yrl6hy+crYc0QeMIUdMM9IN8Cb8mmI8I1jatRwtLDkaZt+Mv0P1adB/INjxbYRddBmnsKczt/0s/F2lJrhT5vgHoTkvWVZWlyPF620zb2qPHOajT/iuQQ+uaeLWPiQyyvPNiHCs+zces45G5fimGORaPGI4XHHNjrAvSv22ibilJs+0tsSV2qEfb3oo7b6Xwuw/ZGIX7gzxpi/v+LRi9g+E4nymNFKStaMrxNsGxJxnZ1Fz3haokVDdImLqi3Kti7CZ+wkXQvVHq1TnqFoyBD9dP06zfZGzgpJwxPTseKzlM3iaOVtqyL1cMUTb9o2jj6xXWOFfRtERzhWLIOffeldkTVq/QQM9yE6zDH6rMmZh9APWOXNkGSxJHzoJuib5NhVfeCb+1g+yGpVubrX4IIlH3EVRYrfrulbNc/iXleTwxPPz9V0KKl0X02Wx2Wa9rhM890u018BBgDOvaD/8G2ecwAAAABJRU5ErkJggg==" alt="" onsubmit="submit();"> <span class="signinTxt">sign in</span> </div> </button> <input name="isUtf8" value="1" type="hidden" /> </div> 

Answer 1

您不能只将RegEx模式添加到输入中吗？

<input id="username" ... pattern="[a-z0-9._%+-]+@mysite.ae$">

Answer 2

这是您的正则表达式[a-zA-Z0-9._+\\-%]+@mysite.ae$

您可以像这样使用它。

<input id="username" name="username" class="signInInputText" type="email" required onChange="alert(validateMe(this))">

function validateMe(t) {
  return (/[a-zA-Z0-9._+\-%]+@mysite.ae$/.test(t.value)) ? "True. change this to what you want" : "False. Change this to what you want";
}