javascript - When using getJSON, how to capture the response data? - Stack Overflow

admin管理员组

文章数量:1401298

something strange is going on... I have he following function:

getInviteLink : function() {
    var me = this,
        invite_url;

    $.getJSON('get_invite_code.json', function(data) {
        console.log(data.invite_url);
        invite_url = data.invite_url;
    });

    console.log(invite_url)

    return invite_url;
},

When this runs, for first console log is returning the correct value. However, on the second console log there is nothing. Why isn't the invite_url able to be set from inside the getJSON function?

Thanks

something strange is going on... I have he following function:

getInviteLink : function() {
    var me = this,
        invite_url;

    $.getJSON('get_invite_code.json', function(data) {
        console.log(data.invite_url);
        invite_url = data.invite_url;
    });

    console.log(invite_url)

    return invite_url;
},

When this runs, for first console log is returning the correct value. However, on the second console log there is nothing. Why isn't the invite_url able to be set from inside the getJSON function?

Thanks

• javascript
• jquery
• json
• getjson

Share Improve this question Follow asked Jul 8, 2012 at 2:16 AnApprenticeAnApprentice 111k202202 gold badges637637 silver badges1k1k bronze badges

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 3

Because the getJSON method is asynchronous. What's happening...

getInviteLink : function() {  // this function is called...
    var me = this,   
    invite_url;               // happens right away

    $.getJSON('get_invite_code.json', function(data) {
        // Step 2, these statements don't happen until later 
        // -- when the response is received
        console.log(data.invite_url);  // this
        invite_url = data.invite_url;
    });  //  Step 1. the getJSON is called right away

    console.log(invite_url) // this happens right after the
                            // the getJSON is called, but before
                            // it gets a response. Thus no data when the log
                            // statement is invoked

    return invite_url;      // also no data (yet) when this return statement
                            // is executed
},

Added To fix your software, you need to realize that you can't do anything with the invite_url until after the JSON response is received from the server. -- And it may never be received if your client ends up with a network problem or a server problem.

You can pass a function to your getJSON call. The function will make use of the invite_url. In the meantime, you can do other things for your client.

If there is nothing for your software to do until you get the response, then set a busy indicator (a rotating circle or something), then launch the json request and have the function cancel the busy indicator when you get the response back.

See the jQuery json docs for more about this.

you can not get invite_url as return value useing getJSON in about code. need to refactor with callback functions if you want to use inviteURL.

in this case if you see the order of the console. its will execute invite_url first and then data.invite_url. the reason being getJSON is asynchronous call. to make this working you need to call get JSON with async: false with is not possible to you need to use $.ajax with datatyoe json. following example will match what you need.

getInviteLink: function() {
    var me = this,
        invite_url;

    $.ajax({
        url: 'get_invite_code.json',
        dataType: 'json',
        async: false,
        success: function(data) {
            console.log(data.invite_url);
            invite_url = data.invite_url;
        }
    });

    console.log(invite_url)

    return invite_url;
},

I if return is not mandatory here i would remend to refactor code and use callback functions instead async false. so you can use getJSON

It does set it, but asynchronously. The callback function is only invoked once the server response has arrived. The $.getJSON function will return as soon as the request is sent, though, so the "second" console.log will actually happen first, before the callback function has been invoked.

You can't write a function like this that synchronously returns the result of an asynchronous server request.

本文标签： javascriptWhen using getJSONhow to capture the response dataStack Overflow