Проверка jQuery, отправка без проверки в Firefox - PullRequest
1 голос
/ 01 сентября 2009

Я собрал довольно простой скрипт соревнования - он закомментирован ниже, и вы можете найти демо на http://www.jakeisonline.com/stackoverflow/jqueryvalidation/page/

Я использую плагин jquery для проверки: http://bassistance.de/jquery-plugins/jquery-plugin-validation/

Проблема только в Firefox (3.5.2) - форма отправляется без какой-либо проверки и игнорирует ajax. IE8 & 7, кажется, в порядке.

$("#f").validate({
        rules: {
            first_name: {
                required: function() {
                    if ($.trim($("#first_name").val()) === 'e.g. Jane') {
                        $("#first_name").val('').removeClass('example');
                        return $("#first_name").val();
                    }                       
                }
            },
            email: {
                required: function() {
                    if ($.trim($("#email").val()) === 'jane@example.com') {
                        $("#email").val('').removeClass('example');
                        return $("#email").val();
                    }
                }
            },
            friend_1_name: {
                required: function() {
                    if ($.trim($("#friend_1_name").val()) === 'e.g. Jane') {
                        $("#friend_1_name").val('').removeClass('example');
                        return $("#friend_1_name").val();
                    }                       
                }
            },
            friend_1_email: {
                required: function() {
                    if ($.trim($("#friend_1_email").val()) === 'jane@example.com') {
                        $("#friend_1_email").val('').removeClass('example');
                        return $("#friend_1_email").val();
                    }
                }
            },
            friend_2_name: {
                required: "#friend_2_email:filled"
            },
            friend_2_email: {
                required: "#friend_2_name:filled"
            },
            friend_3_name: {
                required: "#friend_3_email:filled"
            },
            friend_3_email: {
                required: "#friend_3_name:filled"
            }
        },
        submitHandler: function() {
            $("#submit").attr("disabled", "disabled");                  

            // See if they also opted-in to the main mailing list, if they did, set that interest and add them to the mailing list
            if ($('#optin').is(':checked')) {
                alert('hello');
                $.post("", { first_name: $("#first_name").val(), email: $("#email").val(), key: "sub-678-1.50;1.0.1.0.0.0.0.0.0.0.0.0.0.0.0.0;2.1;subscribe-50.htm", 'prefs[]': ["1", "2"] });
                // Display the opt-in confirmation message
                $("#thanks_subscribing").fadeIn("slow");
                $("#optintickbox").hide();

                // Fade out the confirmation
                setTimeout(function() {
                    $("#thanks_subscribing").fadeOut("slow")
                },10000);

            } else {
                // Add them to the Entries Mailing List
            $.post("", { first_name: $("#first_name").val(), email: $("#email").val(), key: "sub-678-1.50;1.0.1.0.0.0.0.0.0.0.0.0.0.0.0.0;2.1;subscribe-50.htm", followup: "1", prefs: "2"} );
            }

            // Now start going through their friends, the first friend will always be filled out, so we don't need to check that
            $.post("", { first_name: $("#friend_1_name").val(), email: $("#friend_1_email").val(), key: "sub-678-1.51;1.0.1.0.0.0.0.0.0.0.0.0.0.0.0.0;2.1;subscribe-51.htm", followup: "2", custom_4: $("#first_name").val(), custom_5: $("#email").val()} );

            if ($("#friend_2_email").val() !== '') {
                $.post("", { first_name: $("#friend_2_name").val(), email: $("#friend_2_email").val(), key: "sub-678-1.51;1.0.1.0.0.0.0.0.0.0.0.0.0.0.0.0;2.1;subscribe-51.htm", followup: "2", custom_4: $("#first_name").val(), custom_5: $("#email").val()} );
            }

            if ($("#friend_3_email").val() !== '') {
                $.post("", { first_name: $("#friend_3_name").val(), email: $("#friend_2_email").val(), key: "sub-678-1.51;1.0.1.0.0.0.0.0.0.0.0.0.0.0.0.0;2.1;subscribe-51.htm", followup: "2", custom_4: $("#first_name").val(), custom_5: $("#email").val()} );
            }

            // Remove all of the submitted data to stop button spamming
            $("#friend_1_name, #friend_1_email, #friend_2_name, #friend_2_email, #friend_3_name, #friend_3_email").val('');

            // Bring the submit button out of disabled state
            $("#submit").removeAttr("disabled");

            // Bring up the friends sent confirmation
            $("#friends_sent").fadeIn("slow");
            //$("#optin").attr('false', true);

            // Fade out the confirmation
            setTimeout(function() {
                $("#friends_sent").fadeOut("slow")
            },10000);

            return false;
        }
    });

Я не совсем уверен, почему Firefox отправляет страницу с Refresh, но IE нет, я просмотрел код снова и снова и не могу найти ошибку. Firebug находит ошибки только в самой библиотеке jQuery.

Может кто-нибудь помочь?

1 Ответ

1 голос
/ 01 сентября 2009

В вашей разметке XHTML 1.0 Transitional возникли различные проблемы с проверкой. IE хорошо, помогая вам. FF более строг и потерпит неудачу.

Отсутствие входных закрывающих тегов разрушает селекторы внутри скрипта проверки. На первом электронном письме он пытается получить текст элемента li!

См. Следующую проверку валидатора w3c . Исправьте это в первую очередь, надеюсь, это решит проблему. Если не отчитаться, и я посмотрю снова.

...