开发者

parsing JSON using jquery

开发者 https://www.devze.com 2023-01-31 00:44 出处:网络
I\'m trying to parse a simple JSON file. I\'m very new to javascript, JSON, and jquery. I\'d like to extract the information in the JSON file so that I can plot it later using protovis. My JSON is wel

I'm trying to parse a simple JSON file. I'm very new to javascript, JSON, and jquery. I'd like to extract the information in the JSON file so that I can plot it later using protovis. My JSON is well formed, and validates in the JSON lint.

I'm trying to accomplish this by parsing the JSON object's responseText, like this:

var json = $.getJSON("week_13.json").respons开发者_JAVA百科eText;
var week13 = $.parseJSON(json);

in the hope that week13 is something I can access. Just to note, I'm not trying to use a callback function in the $.getJSON call as I'd like to simply have access to the variables so that I can plot them later.

I'm using Chrome, and its console, to try and figure out what's going on. In this code the variable json seems to be an empty string. However, if I write in the javascript console in Chrome:

var json = $.getJSON("week_13.json");

json is an XMLHttpRequest object and its responseText attribute is a big string containing my JSON.

var text = json.responseText;

is a nice string and then if I call jquery's parser

var data = $.parseJSON(text);

then data is now the object I desired. However, if I copy and paste my original two lines into the console I have no luck, and if I use the expanded version froming the json, text and data variables in my original webpage it doesn't work:

var json = $.getJSON("week_13.json");
var text = json.responseText;
var data = $.parseJSON(json);

In this case text is an empty string.

I'm totally confused. If anyone could let me know what I'm doing wrong and give some pointers as to how to make this work, I'd be very happy! Please let me know if any other information as to how I'm going about this is required to answer the question!


$.getJSON() is asynchronous. You need to supply a callback function to process the result. See the API doc for examples of callback functions.

If you really need your call to be synchronous (it will block the browser while you wait for the result), then you can do this instead:

var url = "week_13.json"
var data = jQuery.parseJSON(
        jQuery.ajax({
            url: url, 
            async: false,
            dataType: 'json'
        }).responseText
    );


On $.getJSON you don't need to call parseJSON when using the full parameter. I use it like that:

 $.getJSON('myjson.json', null, function (json_object) {
      // here it is already a json_object
      alert(json_object.text);
   });

The $.getJSON already parse the responseText into JSON object.


$.getJSON function makes all the calls asynchronously by default, therefore this function does not return anything. though there is a parameter of this function which takes a callback and returns the data to the callback function. see the example below.

The other problem to sync the program flow could be resolved by stopping all your functionality before making the call to getJSON, and then start the work again when you receive data in the callback.

You can also use global variable to hold the json and use anywhere in the program.

var json = null; // the global variable to store json returned from file

// stop all your work here. 
// I mean do not perform any more actions here.

// make an ajax call to get the json data
$.getJSON('week_13.json', function (jsonData) {

    // assign the data to global json variable.
    json = jsonData;


    // now call your other function to manipulate json
    // now resume your work here, 
    // and perform other actions which are dependent on json.

});
0

精彩评论

暂无评论...
验证码 换一张
取 消