Firefox 中的 jQuery 验证提交没有验证

Question

我已经编写了一个非常简单的比赛脚本 - 它在下面被注释掉，你可以在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 库本身中查找错误。

谁能帮忙？

Answer 1

您的 XHTML 1.0 过渡标记中有各种验证问题。 IE 通过帮助你来很好。 FF 更严格，会失败。

缺少输入结束标记正在对验证脚本中的选择器造成严重破坏。在第一封朋友的电子邮件中，它实际上是在尝试获取 li 元素的文本！

请参阅以下w3c validator check。先解决这些问题，希望它能解决问题。如果不回来报告，我会再看一遍。