logo标签列表

使用JavaScript进行电子邮件验证

javascript
6

可能是重复问题：
如何在Javascript中验证电子邮件地址？

这是我的第一篇帖子，我有一个小问题。我正在尝试在表单上验证电子邮件地址，但没有成功。我在互联网上找到了这个代码片段，但似乎它不起作用。我目前正在使用Javascript进行验证。我通常不使用JS，所以任何帮助将不胜感激。

<script type="text/javascript">
    function ValidateEmail(inputText)  
    {  
       var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;  
       if(inputText.value.match(mailformat))  
       {  
           document.forms.emailform();  
           return true;  
       }  
       else  
       {  
           alert("You have entered an invalid email address!");  
           document.forms.emailform();  
           return false;  
       }  
    }  


<?php
    $addemail .= '

        <form method="post" action="cart2.php" name="emailform" onsubmit="return validateEmail">
        ';
    $addemail .= '
            E-mail Address: <input type="text" name="email" value="'.$row6['email'].'" size="19" /><input type="hidden" name="cartid" value="'.$cart.'" />';
        if ( $emailerror != '' )
            {
                $addemail .= '<img src="images/email_error.png" width="16" height="16" hspace="4" alt="E-mail Error" />';
            }
        $addemail .= '
            <input type="image" name="Add E-mail Address" alt="Add E-mail Address" src="images/addemail.gif" style="vertical-align:middle" />
        </form>
    ';
    if ( $row6['email'] == '' )
        {
            $emailpresent = 0;
        }
    else
        {
            $emailpresent = 1;
        }
}
        $addemail .= '
                </td>
            </tr>
        ';
}

?>
“not working”是什么意思？您的表单没有提交（可能存在拼写错误，因为您调用了无效的document.forms.emailForm()）吗？ - MD Sayem Ahmed
该正则表达式试图禁止一些完全有效和真实的电子邮件地址（其中包含+符号的地址以及来自museum和info TLDs 的地址显然会被屏蔽）。 - Quentin
HTML5 定义了一个新的输入 type="email"。它具有属性 pattern，您可以在其中指定一个正则表达式。更多详情请参见此处。 - Toni Toni Chopper
2个回答
8

看一下这个Javascript示例，可以清楚地了解如何实现：

<html>

<head>
<script type="text/javascript">
<!--
function validateEmail() {
    var emailText = document.getElementById('email').value;
    var pattern = /^[a-zA-Z0-9\-_]+(\.[a-zA-Z0-9\-_]+)*@[a-z0-9]+(\-[a-z0-9]+)*(\.[a-z0-9]+(\-[a-z0-9]+)*)*\.[a-z]{2,4}$/;
    if (pattern.test(emailText)) {
        return true;
    } else {
        alert('Bad email address: ' + emailText);
        return false;
    }
}

window.onload = function() {
    document.getElementById('email_form').onsubmit = validateEmail;
}
</script>

</head>
<body>

<form id="email_form">
<input type="text" id="email">
<input type="submit">
</form>

</body>
</html>


编辑：

如果您确定您的网页用户正在使用兼容HTML5的浏览器，您可以使用以下更简洁的示例来实现相同的目的:

<!DOCTYPE html>

<html>
    <body>
        <form>
            <input type="email" pattern="^[a-zA-Z0-9\-_]+(\.[a-zA-Z0-9\-_]+)*@[a-z0-9]+(\-[a-z0-9]+)*(\.[a-z0-9]+(\-[a-z0-9]+)*)*\.[a-z]{2,4}$">
            <input type="submit">
        </form>
    </body>
</html>
0
onsubmit="return validateEmail()"

你必须在调用 validateEmail 后面加上括号，否则它会认为你试图返回一个方法。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接