jQuery - проверьте, заполнены ли определенные поля, затем подтвердите адрес электронной почты

Просто пытался собрать две функции с помощью jQuery. При отправке формы код проверяет, все ли поля заполнены, а затем, если все верно, он переходит к другой функции, где проверяет проверку электронной почты.

Я думаю, что я близок, так как когда я нажимаю «Отправить», предупреждение о подтверждении появляется на миллисекунду, а затем отправляется (чего я не хочу, поскольку используемая электронная почта недействительна). Я почти уверен, что это достаточно простой код, поэтому я воздерживался от любых проверок форм.

Вот код:

<script type="text/javascript"> 
    $("#test").submit(function(){
        $(".error").hide();

        var isFormValid = true;

        $(".required").each(function(){
            if ($.trim($(this).val()).length == 0){
                $(this).addClass("highlight");
                isFormValid = false;
            }
            else{
                $(this).removeClass("highlight");
            }
        });
        if (!isFormValid) { 
            document.getElementById("error").innerHTML = "You must fill in all of the fields.";
            return isFormValid;
        }
        else {
            myFunction();
        }
    });

    function myFunction() {
        var isEmailValid = true;

        var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
        var emailaddressVal = $("#email").val();

        if (!emailReg.test(emailaddressVal)) {
            $("#email").after('<span class="error">Enter a valid email address.</span>');
            isEmailValid = false;
        }
        else {
            ///ajax post function here///
        }

        if(!isEmailValid) {
            document.getElementById("error").innerHTML = "Please enter a valid email address.";
            return isEmailValid;
        }
    }
</script>

forms jquery email-validation
person DrDog    schedule 06.03.2013    source источник
comment
Что произойдет, если вы поместите return перед вызовом myFunction() в своем блоке else?   -  person Marc    schedule 06.03.2013

Ответы (1)


arrow_upward
2
arrow_downward

Попробуй это:

<script type="text/javascript"> 
$("#test").submit(function(){
    $(".error").hide();

    var isFormValid = true;

    $(".required").each(function(){
        if ($.trim($(this).val()).length == 0){
            $(this).addClass("highlight");
            isFormValid = false;
        }
        else{
            $(this).removeClass("highlight");
        }
    });
    if (!isFormValid) { 
        document.getElementById("error").innerHTML = "You must fill in all of the fields.";
        return isFormValid;
    }
    else {
        return myFunction();//should return true or false
    }
});

function myFunction() {
    var isEmailValid = true;

    var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
    var emailaddressVal = $("#email").val();

    if (!emailReg.test(emailaddressVal)) {
        $("#email").after('<span class="error">Enter a valid email address.</span>');
        isEmailValid = false;
    }
    else {
        ///ajax post function here///
    }

    if(!isEmailValid) {
        document.getElementById("error").innerHTML = "Please enter a valid email address.";
        return isEmailValid;
    }
    return isEmailValid;//should return true or false
}
</script>
person Rohan Kumar    schedule 06.03.2013