Как написать JSON с помощью jQuery? - PullRequest
Новая
       3

Как написать JSON с помощью jQuery?

1 голос
/ 13 декабря 2011

У меня есть этот файл currencycies.json: 

{
  "USD": {
        "ValueUSD": 325.33,
        "ValueEUR": 344.55,
        "PreviousValueUSD": 324.55,
        "PreviousValueEUR": 354.55,
  },
  "EUR": {
        "ValueUSD": 325.33,
        "ValueEUR": 344.55,
        "PreviousValueUSD": 324.55,
        "PreviousValueEUR": 354.55,
  }
}

Мне нужно разобрать его в "#content", используя jQuery. Может кто-нибудь помочь мне с кодом, чтобы сделать это? Я думаю, что jSONP необходим, потому что канал с другого сервера.

Пример необходимого вывода: 

<div class="currency">USD, 325.33, 344.55, 324.55, 354.55</div>
<div class="currency">EUR, 325.33, 344.55, 324.55, 354.55</div>

Ответы [ 4 ]

2 голосов
/ 13 декабря 2011 
// you will get from server
var obj = $.parseJSON(data); // data contains the string

for (var key in obj) {
  $('<div class="currency" />')
    .html(key + ', ' + $.map(obj[key], function(val) { return val; })
    .join(', ')).appendTo('body');
}

ЗДЕСЬ - это код.

  • $.parseJSON используется для анализа строки в объекте.
  • Затем для каждой валюты внутри объекта используйте .map() для сопоставления значений.
  • Объедините значения в строку, разделенную ,, добавьте к div и имени валюты.
  • Результирующий div добавить к телу.

Обновление (см. Комментарии):

Если вы хотите получить эти данные междоменного использования: 

$.getJSON('www.domain.com/currencies.json?callback=?', function(data) {
  for (var key in data) {
    $('<div class="currency" />')
    .html(key + ', ' + $.map(data[key], function(val) { return val; })
    .join(', ')).appendTo('body');
  }
});
1 голос
/ 13 декабря 2011

Как-то так должно помочь (данные, проанализированные из вашего JSON выше, хранятся в переменной data): 

var $body = $("body"),
    key,
    $div,
    txt,
    innerKey;

for (key in data) {
    if (data.hasOwnProperty(key)) {
        $div= $("<div></div").addClass("currency");
        txt = [key, ", "];
        for (innerKey in data[key]) {
            if (data[key].hasOwnProperty(innerKey)) {
                txt.push(data[key][innerKey]);
                txt.push(", ");
            }
        }

        // Remove the trailing comma
        txt.pop(); 

        // Set the HTML content of the div and then add to the body
        $div.html(txt.join("")).appendTo($body);
    }
}

Вот рабочий пример jsFiddle .

0 голосов
/ 13 декабря 2011

Более пуристический подход, который также может помочь вам понять, как перебирать объекты (и является нативным для браузера и поэтому не полагается на jQuery) 

for(var data in #YOUR_JSON_DATA# ){ // iterate through the JSON nodes
  var tmp = data; // store the current node in temporary variable
  for(var val in json[data]){ // iterate through the current nodes' children
    tmp += ", " + json[data][val]; // this is how you access multidimensional objects. format your output as you like
  }
  alert(tmp); // see the output. here you could use jquery to write this into your page.
}
0 голосов
/ 13 декабря 2011

хорошо, вы можете получить доступ к таким вещам, как:

data.USD.ValueUSD даст вам 325,33, так что вы можете сделать что-то подобное.передайте объект данных, полученный при вызове ajax, в функцию ur success, чтобы вызвать эту функцию: 

function populateContent(data){

     var $currencyDiv = $('<div class="currency"></div>'),
     $currencyDiv2 = $currencyDiv.clone();

     $currencyDiv.html("USD, "+data.USD.ValueUSD + ", " + data.USD.ValueEUR + ", " + data.USD.PreviousValueUSD + ", " + data.USD.PreviousValueEUR);

     //do the same for currencydiv2
     //append your new content divs wherever you want

     $('body').append($currencyDiv);

}
...