Jquery variablename dynamically (compose from string and number)

问题

Hello I'm quite desperate searching for a solution for the following problem.

In my script I make an Ajax GET request which returns JSON data. It succesfully returns the data, after this I loop it and then my problem occurs.

I have the size of the data among with the main data returned and then I make a loop to append each result to my html code.

resp.size = size of resp for example resp.sp0 = data item

For each step it should then append to the main html code.

$(".magicproducts").append(resp.sp0.d1);

$(".magicproducts").append(resp.sp1.d1);

$(".magicproducts").append(resp.sp2.d1);

etc..

I tried this in my loop but it does not work, it alerts the correct name but does not work when i use it as a variablename.

var name = "resp.sp"+i; alert(name);

THE COMPLETE CODE CODE :

//SET URL TO FOR AJAX GET

var url = $("#url").val();

//

//START AJAX CALL

$.ajax({ 
type: "GET",
dataType: 'json',
url: "../../inc/myscript.php?url="+url,
success: function(resp){
var datasize = (resp.size);
var i = 0;
do {
var name = "resp.sp"+i; 
alert(name);
$(".magicproducts").append(name.d0);
i++;
}
while (i < datasize+1);
} 
});

});

I would appriciate any inputs or answers on how to solve it in the same style as im approaching it now.

Second to this Im wondering if there is no other approach. Somesort of foreach ? So that it auto loops all the items the resp data contains.

回答1:

The syntax for accessing a JSON object with a string is this:

var name = "sp"+i;
resp[name].d0

To answer your second question, yes there might be a better way.

Since you are already using jquery, you can $.each like so:

//SET URL TO FOR AJAX GET

var url = $("#url").val();

//

//START AJAX CALL

$.ajax({ 
    type: "GET",
    dataType: 'json',
    url: "../../inc/myscript.php?url="+url,
    success: function(resp){
        $.each(resp, function(key, value) {
            // key is sp0, sp1, sp2...
            // value is { d0: "magic_product", d1: "more_data", d3: "even more data", etc... }
            $('.magicproducts').append(value.d0);
        });
    } 
});

You can also nest the $.each statements to dig into JSON object as far as you want. Let's say your JSON looks like this

{ 
    "sp0" : 
    { 
      "d0": { "hello": "world" },
      "d1": { "hello": "mom" } 
    },
    "sp1" : 
    { 
      "d0": { "hello": "dad" },
      "d1": { "hello": "earth" } 
    }
}

You can nest your $.each statements to loop through each level of the JSON object like so:

// first foreach statement to loop through sp0, sp1, etc...
$.each(resp, function(sp, d) {
    // second foreach statement to loop through d0, d1, d2, etc....
    $.each(d, function(i, value) {
        // do something with value
        // ....
    });
});

来源：https://stackoverflow.com/questions/34345544/jquery-variablename-dynamically-compose-from-string-and-number

标签

javascript

jquery

ajax