如何使用jQuery创建JSON对象


80

我有以下格式的JSON对象:

temp:[
        {
           test:'test 1',
           testData:  [ 
                       {testName: 'do',testId:''}
                         ],
           testRcd:'value'                             
        },
        {
            test:'test 2',
           testData:  [
                            {testName: 'do1',testId:''}
                         ],
           testRcd:'value'                           
        }
      ],

如何在上述格式的jquery中创建JSON对象。我想创建一个动态JSON对象。

Answers:


213

只需将数据放入这样的对象中即可:

var myObject = new Object();
myObject.name = "John";
myObject.age = 12;
myObject.pets = ["cat", "dog"];

然后通过以下方式对其进行字符串化:

var myString = JSON.stringify(myObject);

您不需要jQuery。这是纯JS。


2
动态创建索引名称是否可行。例如:var name = $('#myname')。val(); myObject.name =“ john” //此处名称索引将始终来自输入框。
萨哈达特·侯赛因博士2014年

3
上述评论的一个障碍:用方括号中的变量替换任何静态值,例如.name .age.pets仅将其替换,包括点。示例:myObject[cssProp] = cssVal;然后,将在对象中使用这两个CSS变量的值。这是一个jsFiddle:http
//fiddle.jshell.net/arttronics/rucjtbza/

31

“ JSON对象”没有任何意义:JSON是一种基于Javascript对象声明结构的交换格式。

如果要将JavaScript对象转换为json字符串,请使用JSON.stringify(yourObject);

如果要创建一个javascript对象,只需执行以下操作:

var yourObject = {
          test:'test 1',
          testData: [ 
                {testName: 'do',testId:''}
          ],
          testRcd:'value'   
};

1
@guillaumealgis,您能解释回滚到我的编辑吗?如果通过JSONLint运行对象,则将其标记为无效(左键需要用双引号引起来)。我并不是说您错了,我想了解为什么您认为它是有效的JSON,因为它可能是我不了解的东西。如果通过相同的验证器运行我的版本,它将作为有效的JSON返回。
2014年

1
@delliottg不要使用JSON验证器来验证JavaScript。请再次阅读我的答案的开头。
DenysSéguret2014年

2
@delliottg我并不是说这是有效的JSON。这个答案的重点是区分JSON和JS对象。尝试在JS解释器中运行dystroy代码,您会发现它运行得很好。
Guillaume Algis 2014年

3
感谢大家的评论,在再次阅读完这些内容并询问自己有关正在从事的项目的问题后,我意识到我对这些内容的工作方式有一个根本性的误解。我很确定我现在已经明白了,感谢您的耐心配合。
2014年

5

我相信他正在要求将新的json写入目录。您将需要一些JavascriptPHP。因此,背负其他答案:

script.js

var yourObject = {
  test:'test 1',
  testData: [ 
    {testName: 'do',testId:''}
   ],
   testRcd:'value'   
};
var myString = 'newData='+JSON.stringify(yourObject);  //converts json to string and prepends the POST variable name
$.ajax({
   type: "POST",
   url: "buildJson.php", //the name and location of your php file
   data: myString,      //add the converted json string to a document.
   success: function() {alert('sucess');} //just to make sure it got to this point.
});
return false;  //prevents the page from reloading. this helps if you want to bind this whole process to a click event.

buildJson.php

<?php
    $file = "data.json";  //name and location of json file. if the file doesn't exist, it   will be created with this name

    $fh = fopen($file, 'a');  //'a' will append the data to the end of the file. there are other arguemnts for fopen that might help you a little more. google 'fopen php'.

    $new_data = $_POST["newData"]; //put POST data from ajax request in a variable

    fwrite($fh, $new_data);  //write the data with fwrite

    fclose($fh);  //close the dile
?>

1

如何获取附加输入字段值作为json这样

temp:[
        {
           test:'test 1',
           testData:  [ 
                       {testName: 'do',testId:''}
                         ],
           testRcd:'value'                             
        },
        {
            test:'test 2',
           testData:  [
                            {testName: 'do1',testId:''}
                         ],
           testRcd:'value'                           
        }
      ],

0

嵌套JSON对象

var data = {
        view:{
            type: 'success', note:'Updated successfully',
        },
    };

您可以分析这个data.view.typedata.view.note

JSON 对象和内部数组

var data = {
          view: [ 
                {type: 'success', note:'updated successfully'}
          ],  
     };

您可以分析这个data.view[0].typedata.view[0].note


-1
var model = {"Id": "xx", "Name":"Ravi"};
$.ajax({    url: 'test/set',
                        type: "POST",
                        data: model,
                        success: function (res) {
                            if (res != null) {
                                alert("done.");
                            }
                        },
                        error: function (res) {

                        }
                    });

很好,但问题不涉及C#或ASP
Machavity

@Machavity,您在哪里找到C#?
拉维·阿南德

1
该评论是关于答案的第一个修订版本,其中包含C#。现在,在对model变量进行硬编码时,它甚至变得没有意义了。这个问题是:“在JavaScript中,如何在运行时创建对象并以JSON表示法表示该对象”,您的答案仍然没有显示。
CodeCaster
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.