jQuery表单提交AJAX问题答案

【问题标题】：jQuery form submission AJAX issuejQuery表单提交AJAX问题
【发布时间】：2011-12-18 18:14:39
【问题描述】：

我显然缺少 jQuery、表单提交和 AJAX 的一些东西。 PHP 后端和 JSON 编码工作正常。但是当表单提交时，它就像数据提交两次，进入表单的值为null。

这是我的脚本：

$(document).ready(function () {
    var validated = $("#loginForm").validate({
        errorLabelContainer: "#errorMessage",
        wrapper: "li",
        rules: {
            username: "required",
            password: "required"
        },
        messages: {
            username: "Please enter your username.",
            password: "Please enter your password."
        },
        submitHandler: function (form) {
            $.ajax({
                type: 'POST',
                url: $(form).attr('action'),
                data: $(form).serialize(),
                dataType: 'json',
                success: function (res) {
                    if (res.err == true) {
                        $("#errorMessage").text(res.msg);
                    } else {
                        window.location = res.url;
                    }
                },
                error: function () {
                    $("#errorMessage").text("There was an error processing form.");
                },
            });
        }
    });
});

【问题讨论】：

你在使用萤火虫吗？ ..“就像数据是……”表明您没有有效地监控您的 XHR 调用。
介意jsfiddle？
页面有错误吗？验证插件是否有效？此外，error 选项后还有语法错误（额外的逗号）。

标签： jquery ajax forms submit

【解决方案1】：

我做了这个，似乎代码应该可以工作。在萤火虫中，我看到请求发送的所有表单日期都是正确的。我注意到，如果定义了 dataType 属性，则响应的数据类型必须正确。

http://jsfiddle.net/7vtAw/

【讨论】：