Javascript 无法使用jquery从表单值发送json数据

Javascript 无法使用jquery从表单值发送json数据,javascript,jquery,json,ajax,Javascript,Jquery,Json,Ajax,我正在创建一个json对象,其中我从表单中提取字段,然后使用jquery Ajax POST发送数据。但是当我在按下submit之后看到我的网络标签时,我基本上得到了json标题,但是除了我正在硬编码的值之外,应该从表单中提取的所有值都是空的。注意,我的json数据还有一个类型为room的嵌套json 下面是我的jquery部分:- var formData={ "checkInDate": $("#checkInDate").val(), "checkOutD

我正在创建一个json对象,其中我从表单中提取字段,然后使用jquery Ajax POST发送数据。但是当我在按下submit之后看到我的网络标签时,我基本上得到了json标题,但是除了我正在硬编码的值之外,应该从表单中提取的所有值都是空的。注意,我的json数据还有一个类型为room的嵌套json

下面是我的jquery部分:-

 var formData={
        "checkInDate": $("#checkInDate").val(),
        "checkOutDate": $("#checkOutDate").val(),
        "roomsWanted":$("#roomsWanted").val(),
        "room":{
            roomType: $("input[name=roomType]:checked").val(),
            roomProperty:"non-smoking"
        }

    };
$("#checkAvailabilityForm").submit(function(e){
        e.preventDefault();

        $.ajax({
            type: 'post',
            url: '',
            dataType: 'json',
            data: JSON.stringify(formData),
            contentType: 'application/json',
            success: function(dataRecieved){
                var dataRecieved= $.trim(dataRecieved);
                if(dataRecieved === ''){

                }else{

                }
            }

        });
    });

formData
的声明移动到
.submit()
函数中。现在页面加载的方式是,然后
var formData=…
立即将formData的值设置为新的空表单的值

您的代码应该如下所示:

$("#checkAvailabilityForm").submit(function(e){
    e.preventDefault();

    var formData={
        "checkInDate": $("#checkInDate").val(),
        "checkOutDate": $("#checkOutDate").val(),
        "roomsWanted":$("#roomsWanted").val(),
        "room":{
            roomType: $("input[name=roomType]:checked").val(),
            roomProperty:"non-smoking"
        }
    };

    $.ajax({
        type: 'post',
        url: '',
        dataType: 'json',
        data: JSON.stringify(formData),
        contentType: 'application/json',
        success: function(dataRecieved){
            var dataRecieved= $.trim(dataRecieved);
            if(dataRecieved === ''){

            }else{

            }
        }

    });
});

您不需要将json字符串化,只需将json字符串化即可


data:formData

我已经这样做了,但它没有显示任何内容,事实上也没有将其表示为json。这是我在浏览器的开发者控制台中看到的,来自表单的值仍然为空。看起来这个“checkInDate=&checkOutDate=&roomsWanted=&room%5BroomProperty%5D=无烟”实际上你也是对的,因为我已经按照上面黑魔王的建议在外面声明了var提交。谢谢。这么简单的错误。我挠头已经快一个小时了。