使用变量创建 json 对象答案

【问题标题】：creating json object with variables使用变量创建 json 对象
【发布时间】：2012-10-10 08:50:16
【问题描述】：

我正在尝试从我在表单中获取的变量创建一个 json 对象。

var firstName = $('#firstName').val();
var lastName  = $('#lastName').val();
var phone     = $('#phoneNumber').val();
var address   = $('#address').val();

到目前为止，我有下面的代码，但它不会验证或工作。我是新手，请帮忙！将 var 更改为：

var jsonObject = 
                {
                 firstName: firstName, 
                 lastName: lastName,
                 phoneNumber:phoneNumber,
                 address:address
                }

在 JSONlint 中我收到此错误：

第 1 行的解析错误： varjsonObject={
^ 期待 '{', '['

【问题讨论】：

您确定要创建 JSON 而不是 JS 对象吗？另外，对象的哪些部分应该是变量？第一部分如何连接到第二部分？如果您真的想将formObject 转换为 JSON，那么您就很不幸，因为您无法将 jQuery 对象转换为 JSON（并且您在 "firstName": ('#firstName') 中缺少 $）。请具体说明您想要获得的结果，现在这有点令人困惑，因为您似乎正在努力使用正确的术语。
您可能会发现在 MDN JavaScript 指南中阅读有关对象的更多信息会有所帮助：developer.mozilla.org/en-US/docs/JavaScript/Guide/…。
我想要的结果是一个我可以使用 ajax 发送的 json 对象。
JSON 对象不存在 (benalman.com/news/2010/03/theres-no-such-thing-as-a-json)。要么您实际上想要一个 JS 对象并将其设置为 data: ... 在 $.ajax 配置中。或者您想将对象转换为 JSON 并将包含 JSON 的字符串发送到服务器。在 JSONlint 中出现错误的原因是您输入的是 JavaScript (var jsonObject = ..)，而不是 JSON。如果您输入 JSON.stringify(jsonObject) 的输出，它可能会验证。与 JS 对象文字相比，我真的建议您花时间了解 JSON 到底是什么。
var jsonObject = {...} 是有效的 JavaScript，但不是有效的 JSON！

标签： javascript jquery json object

【解决方案1】：

如果您需要双引号 JSON，请使用 JSON.stringify( object)

var $items = $('#firstName, #lastName,#phoneNumber,#address ')
var obj = {}
$items.each(function() {
    obj[this.id] = $(this).val();
})

var json= JSON.stringify( obj);

演示：http://jsfiddle.net/vANKa/1

【讨论】：

【解决方案2】：

var formValues = {
    firstName: $('#firstName').val(),
    lastName: $('#lastName').val(),
    phone: $('#phoneNumber').val(),
    address: $('#address').val()
};

请注意，这将包含元素的值在解释对象字面量的时间点，而不是在访问对象的属性时。您需要为此编写一个吸气剂。

【讨论】：

感谢您的提示。我在更新的代码中使用变量的方式是否正确？
@Anthony 是的，它是正确的。但是，JSLint 不会为您提供任何有意义的信息，因为您有一个 javascript 对象，而不是 JSON。

【解决方案3】：

试试这个，看看如何从字符串创建对象。

var firstName = "xx";
var lastName  = "xy";
var phone     = "xz";
var adress    = "x1";
var obj = {"firstName":firstName, "lastName":lastName, "phone":phone, "address":adress};
console.log(obj);

【讨论】：

【解决方案4】：

在执行$('#lastName') 之类的操作时，您正在引用一个 DOM 元素。这是一个具有id 属性“lastName”的元素。为什么要这样做？您想引用存储在一个完全不相关的局部变量中的值。试试这个（假设对formObject 的赋值与变量声明在同一范围内）-

var formObject = {
    formObject: [
        {
            firstName:firstName,  // no need to quote variable names
            lastName:lastName
        },
        {
            phoneNumber:phoneNumber,
            address:address
        }
    ]
};

这似乎很奇怪：您正在创建一个对象“formObject”，其中包含一个名为“formObject”的成员，该成员包含一个对象数组。

【讨论】：

【解决方案5】：

在 Object Literal

上调用

我不确定你想要你的结构是什么，但根据你上面的内容，你把值放在变量中试试这个。

var formObject =  {"formObject": [
                {"firstName": firstName, "lastName": lastName},
                {"phoneNumber": phone},
                {"address": address},
                ]}

虽然这似乎更有意义（为什么你在上面的文字中有一个数组？）：

var formObject = {
   firstName: firstName
   ...
}

【讨论】：