javascript - javascript电子邮件验证而不提交

Question

我想验证这封电子邮件：

<div>
    <div>

        <div  >
            <big><p>please enter an email address IF you wish to
            recieve a link to your results.<p>
            E-mail Address:</big> <input name="recipient"class="upload" type="text"
            />
        <div id="correct">
            &#10004;
        </div>
        <div id="incorrect">
            &#10008;
        </div>
    </div>
</div>

我想检查电子邮件输入是否有效，如果有效则显示“正确”的 div，如果不显示“不正确”的 div，我想在不提交表单的情况下执行此操作。

没人能帮忙吗？谢谢

Answer 1

基于多个 JS 框架的客户端验证的几种替代方案/插件/解决方案可用。我只引用了一个使用 jQuery 的示例： http: //speckyboy.com/2009/12/17/10-useful-jquery-form-validation-techniques-and-tutorials-2/

Answer 2

这是一个使用正则表达式匹配值的函数。

<script language="javascript">
    function checkEmail() {
    var email = document.getElementById('recipient');
    var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
    if (!filter.test(email.value)) {
    alert('Please provide a valid email address');
    email.focus;
    return false;
    document.getElementById('incorrect').style.visibility="visible";
    document.getElementById('correct').style.visibility="hidden";
    }
    else
    {
    document.getElementById('correct').style.visibility="visible";
    document.getElementById('incorrect').style.visibility="hidden";
    }
    }
    </script>

Answer 3

从这个答案

function validateEmail(email) { 
    var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\ ".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
    return re.test(email); 
}