只想接受 html 形式的特定电子邮件地址

Question

我正在创建一个只接受某个电子邮件地址的表单。如果使用了错误的地址，则会出现一条消息。 我想在我的脚本中使用“.pattern！= email”之类的东西，但是我知道这个属性只能在输入中使用。我也尝试使用 .match 没有任何成功。

这是一个sn-p的形式：

<form onsubmit="return validation()">
<label for="email"> <b> Email: </b> </label>
            <input type="email" name="email" id="emailinput" placeholder="Please enter email" 
            pattern=".+@gmail.com"> <span id="message"></span>
</form>

相关脚本：

<script>
funcion validation() {
if (document.getElementById("emailinput").pattern != ".+@gmail.com") {
    document.getElementById("message").innerHTML 
    = "<em> Must be a gmail '@gmail.com' account </em>";
    return false;
else
    return true;}
</script>

Answer 1

@(gmail.com) 将匹配 @gmail.com 特别...

@ 匹配 @ 符号

有点像

[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+[\S]

你的@部分之前的部分可能工作...

[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+[\S]@(gmail.com)

通过函数运行您的电子邮件并返回regex.test(email)，这将返回一个可在条件中使用的布尔值。

let email = document.getElementById('email');
let b = document.getElementById('b');
const emailIsValid = (email) => {
  return /[\S]+@(gmail.com)/.test(email)
}

b.addEventListener('click', function() { 
  emailIsValid(email.value)?
    console.log(emailIsValid(email.value)):
    console.log(emailIsValid(email.value) + ':  ' + email.value + ' is not valid gmail address!');
  
})

Enter an email: <input id="email"> <button id="b">Test It</button>