0

フォームの送信ボタンがクリックされると、すべてのフィールドを検証する関数が呼び出されます。ただし、検証に失敗した場合は何も起こりません。

mailto:アクションとして使用していますが、違いはありますか?
次の 2 点について明確にしたいと思います。

  1. これは、送信ボタンをクリックしたときに関数を呼び出す正しい方法ですか?

    $(document).ready(function(){
    $('#contactForm').submit(function(){
        checkMail();
    });
});

  2. を使用している場合でも、フィールドを検証できますmailto:か?

残りのコードは次のとおりです。

function checkEmail(){
    var email = document.contact.email.value;

    if(email == "") {
        document.getElemtById("email_error").innerHTML = "No Email Address";
        return false;
    }
    else {
        document.getElementById("email_error").innerHTML = ""
        return true;
    }
}

HTML:

<form name="contact" action="mailto:exampleemail@hotmail.com" method="post">
    <li>
        <label for="email">Email</label>
    <input id="email" type="text" name="email" placeholder="Enter Email Address">
    </li>
    <span id="email_error"></span>

さらに、送信をクリックしてもエラーメッセージは表示されません。

4

3 に答える 3

1

return falseいいえ、検証が失敗した場合に備えて、イベント ハンドラーが必要です。これにより、アクションが実行されなくなります。つまり、メール プログラムが起動されなくなります。

イベント オブジェクトで .preventDefault() を呼び出すか、ハンドラから false を返すことで、送信アクションをキャンセルできます。

ソース

次のように変更します。

$(document).ready(function(){
    $('#contactForm').submit(function(){
        return validate();
    });
});

もちろん、これは、検証が失敗した場合validate()に関数が実際に戻る必要があることを意味し、そうでない場合は.false true

さらにid="contactForm"、<form>タグがありません。

また、メールの値を正しく取得する必要があります。

var email = $("#email").val();

別の間違いがあります: スペルが間違ってgetElementById()います。修正版は次のとおりです。

function checkEmail() {
    var email = $("#email").val();

    if (email == "") {
        document.getElementById("email_error").innerHTML = "No Email Address";
        return false;
    }
    else {
        document.getElementById("email_error").innerHTML = ""
        return true;
    }
}

または代わりに、すべての jQuery を使用します。

function checkEmail() {
    var email = $("#email").val();
    var $error = $("#email_error");
    if (email == "") {
        $error.html("No Email Address");
        return false;
    }
    else {
        $error.html("");
        return true;
    }
}
于 2012-10-04T10:11:00.763 に答える
0

必要なものは次のとおりです。

$(document).ready(function(){
   $('#contactForm').submit(function(){
       if (!validate()) {
           return false; // Prevent the submit
       }
   });
});
于 2012-10-04T10:10:11.507 に答える
0

フォームのフィールドを送信する前に検証するには、jQuery の検証プラグインを使用できます。

$(document).ready(function(){

    $("#contactForm").validate({
        submitHandler: function(form) {
            // some other code
            // maybe disabling submit button
            // then:
            $(form).submit();
        }
    });

});

詳細と例については、オンライン ドキュメントを確認してください。

于 2012-10-04T10:11:50.747 に答える