Javascript電子メールの検証 - ヘルプ?

私は現在、メールフォームを使用しています。メールフォームは、メールアドレスが送信された後に投稿されます。私はこれに妥当性チェックオプションを追加して、偽の情報を私に送信しないようにしたいと思います。以下では、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 = '[email protected]';;
$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>';
}
?>

Current 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();
                });
            }
        });
    });
});

Validation Script I'd Like To Add to My Current 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;
}
0
「トウメール」とは何ですか? (私は として「電子メールにする」と読んだが失敗した)あなたが電子メールフィルタのコレクションを持っていたら、それは「トーメール刈り手」だろうか?また、JSを使用してクライアント側の電子メールの検証を行う場合は、正規表現などを使用してください。それは恐ろしい電子メールアドレスのチェックです。
追加された 著者 Dave Newton,
私は jsfiddle.net/Ya4d6 にあなたのコードを抽出しました。もし私が入力するか、すべて正常に機能するようです。 !?
追加された 著者 Grrbrr404,
電子メールが送信される電子メールアドレスを参照するのは「電子メールに」です
追加された 著者 William George,

2 答え

javascriptで妥当性検査を行うことは、愚かなことではありません。特にPHPで妥当性検査を行っていないためです。 Javascriptバリデーターをバイパスし、偽の情報をサーバーに直接送信するのは簡単です。

JSの検証はすぐにフィードバックを提供するのに役立ちますが、サーバー側のコードを実際に保護するために信頼されるべきではありません。

あなたのPHPを次のように変更してください:

$email = $_POST['email'];;

if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
   die("Invalid email address");
}
3
追加された
そして、javascriptサイトでは、正規表現がはるかに良い方法になります。 [A-Z0-9 ._%+ - ] + @ [A-Z0-9 .-] + \。[A-Z] {2,4}
追加された 著者 Grrbrr404,
@MarcBこれは素晴らしい解決策です、私は多くのPHPをしないので、これは完璧です。私の唯一の質問は、テキストが表示された後で、ページ上でそのフォームをリロードできますか?現在、フォームは「無効なメールアドレス」に置き換えられていますが、フォームには有効なメールを入力できるようにフォームがあります。私はブラウザでポップアップしても大丈夫です
追加された 著者 William George,

Grrbrrが言っていたregexスクリプトの実例を以下に示します:

$( "#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')

  }
 })
2
追加された
JavaScript - 日本のコミュニティ
JavaScript - 日本のコミュニティ
2 参加者の

日本人コミュニティのjavascript