Javascript电子邮件验证-帮助

Javascript Email Validation - Help?

本文关键字：帮助 验证 电子邮件 Javascript      更新时间：2023-09-26

我目前正在使用一个电子邮件表单，一旦提交了电子邮件地址，它就会发布一些文本。我想添加一个验证选项，这样我就不会得到虚假信息发送给我。下面我附加了html代码、javascript、php和我想使用的验证代码。我目前遇到的问题的形式仍在处理，即使电子邮件是无效的。请帮助。

HTML 

<form action="scripts/women-logo-white-process.php" method="post" id="contact_form_women_logo_white" name="ContactForm" onsubmit="return ValidateContactForm();">
     <div style="width: 179px; margin-left: 115px">
          <div style="width: 179px;">
               <input type="text" name="Email" id="email" value="email" rel="req" tabindex="2" class="text-area" />
          </div>
          <div id="loader" style="width: 121px; margin-left: 27px;">
               <div class="submit-button" style="width:121px;"><input type="submit" name="" value=""></div>
          </div>
      </div>
</form>
PHP 

<?php 
$toemail = 'orders@paroteesclothing.com';;
$email = $_POST['email'];;
$messageBody = "Email: " . $email;

if(mail($toemail, 'Mens Logo White' . $subject, 'From: ' . $email)) {
    echo '
    <div>
      <div class="success"></div>
      <div class="email-text">Thank you for your interest in our products. We will notify you as soon as this product is available. Until then please check back for new designs and follow use on Twitter & Facebook @ParoteesApparel.</div>
    </div>';
} else {
    echo '
    <div>
      <div class="error"></div>
      <div class="email-text">There was a problem with your submission, please reload this page and try again.</div>
    </div>';
}
?>
当前Javascript 

$(function () {
    $('#contact_form_men_logo_white').submit(function (e) {
        e.preventDefault();
        var form = $(this);
        var post_url = form.attr('action');
        var post_data = form.serialize();
        $('#loader', form).html('<div style="margin-left: -30px; margin-bottom: 35px; margin-top: -20px;"><div class="loader"></div><div class="wait-text">Please wait...</div></div>');
        $.ajax({
            type: 'POST',
            url: post_url,
            data: post_data,
            success: function (msg) {
                $(form).fadeOut(500, function () {
                    form.html(msg).fadeIn();
                });
            }
        });
    });
});

我想添加到当前Javascript的验证脚本

function ValidateContactForm() {
    var email = document.ContactForm.Email;
    if (email.value == "")
    {
        window.alert("Please enter a valid e-mail address.");
        email.focus();
        return false;
    }
    if (email.value.indexOf("@", 0) < 0)
    {
        window.alert("Please enter a valid e-mail address.");
        email.focus();
        return false;
    }
    if (email.value.indexOf(".", 0) < 0)
    {
        window.alert("Please enter a valid e-mail address.");
        email.focus();
        return false;
    }
    return true;
}

在javascript中进行验证是徒劳的，特别是因为您没有在PHP中进行验证。绕过Javascript验证器并直接向服务器发送虚假信息是微不足道的。

虽然JS验证对于提供即时反馈很有用，但不应该依赖它来实际保护您的服务器端代码。

把你的PHP改成:

$email = $_POST['email'];;
if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
   die("Invalid email address");
}

下面是Grrbrr所说的正则表达式脚本的一个工作示例:

其中$("#email")是你的表单输入元素:

$("#email").blur(function () {
var reg = /^([A-Za-z0-9_'-'.])+'@([A-Za-z0-9_'-'.])+'.([A-Za-z]{2,4})$/;
var address = $(this).val();
if(reg.test(address) == false) {
$("#valbox").removeClass().addClass("valincorrect").html('Please enter a valid e-   mail').fadeIn(500)
 } else {
$("#valbox").removeClass().addClass("valcorrect").html('Accepted')
  }
 })
相关文章：