更新

Question

这是我的表单标记

                <form name="contactForm" id="contactForm" role="form">
                    <div style="width: 190px">
                        <div class="form-group">
                            <input type="text" placeholder="fullname" name="fullname" id="formFullname" class="form-control">
                        </div>
                        <div class="form-group">
                            <input type="email" placeholder="email" name="email" id="fromEmail" class="form-control">
                        </div>
                        <div class="form-group">
                            <input type="text" placeholder="company" name="company" id="fromCompany" class="form-control">
                        </div>
                    </div>
                    <div class="clear"></div>
                    <div class="form-group">
                        <textarea placeholder="message" name="message" id="formMessage" rows="3" class="form-control"></textarea>
                    </div>

                    <button class="btn btn-success" type="submit" name="submit" id="formSubmit">send</button>
                </form>

使用jquery 1.10.2

这是JS

 var form = $('#contactForm');

form.submit(function () {
    console.log("form ", $(this).serialize());
    $.ajax({
        type: "POST",
        url: url + "ajax/sendmail",
        data: $(this).serialize(),
        success: function (response) {
            console.log(response);
        }
    });
    return false;
});

我知道该功能触发，经过警告测试。但是console.log没有返回任何东西，在ajax调用期间我在POST中看不到任何东西（用firebug的XHR观察）。

BTW：role =“form”是因为我正在使用Twitter Bootstrap框架

我做错了什么？

更新

数据：$（表格）.serialize（）也没有帮助

Answer 1

如果您尝试这样做：

form.submit(function () {
    console.log("form ", $(this).serialize());
    return false;
});

它运作得很好。所以我认为问题

form.on('submit',function () {
    event.preventDefault();
    console.log("form ", $(this).serialize());
    $.ajax({
        type: "POST",
        url: url + "ajax/sendmail",
        data: $("form").serialize(),
        success: function (response) {
            console.log(response);
        }
    });
    return false;
});

由于代码中的$(this)未引用form，而是引用jQuery方法调用的ajax

Answer 2

尝试以下代码，但首先修改表单HTML，使其具有“action”属性。这段代码的优点在于它可以在任何具有提交按钮和动作属性的表单上使用。（即它没有与任何特定的ID相关联）

$(function() {

    $('input[type="submit"]').click(function(event) {
        event.preventDefault();
        var form = $(this).closest('form');
        var url = form.attr('action');
        var data = form.serialize();
        $.post(url, data)
            .done(function() {
                alert('Yay! your form was submitted');
            })
            .fail(function() {
                alert('Uh oh, something went wrong. Please try again');
            });
    });

干杯。

表格序列化问题

更新

2 个答案: