Как разобрать массив JSON в jQuery? - PullRequest
Новая
       48

Как разобрать массив JSON в jQuery?

5 голосов
/ 22 октября 2009

EDIT Я проверил документацию jQuery и, используя $ .ajax с указанным типом данных json, возвращает оцененный объект javascript, поэтому eval () здесь не является ответом. В любом случае, я знал, что я могу анализировать отдельные объекты JSON, но не массивы. Проблема в том, что мне нужно пройти через них.)

Я следовал синтаксису парсинга массива JSON в jQuery в букву, но по какой-то причине он не работает. Я извлекаю массив, используя $ .ajax, указал правильный тип данных и в Firebug вижу, что ответ от моего PHP-скрипта - []. Тем не менее, когда я пытаюсь использовать $ .each для перебора массива, все, что я получаю, это неопределенные значения, когда я пытаюсь console.log различных частей массива. Вот где мой PHP-скрипт создает и кодирует массив: 

if(mysqli_num_rows($new_res) > 0) {
$messages = array();

while($message_data = mysqli_fetch_assoc($query_res)) {
  $message = array(
    'poster' => $message_data['poster'],
    'message' => $message_data['message'],
    'time' => $message_data['time']
  );

  $messages[] = $message;
}

echo json_encode($messages);
} else if(mysqli_num_rows($new_res) == 0) {
$message = array(
  'poster' => '',
  'message' => 'No messages!',
  'time' => 1
);

echo json_encode($message);
}

И вот моя попытка разобрать его: 

   var logged_in = '<?php echo $logged_in; ?>';
   var poster = '<?php echo $_SESSION["poster"];?>';
     $.ajax({
     url: 'do_chat.php5',
     type: 'post',
     data: ({'poster':poster,'logged_in':logged_in}),
     dataType: 'json',
     success: function(data) {
         $.each(data, function(messageIndex, message) {
                    console.log(parseInt($('#chatWindow :last-child > span').html())+' '+message['time']);
       if((parseInt(message['time']) > parseInt($('#chatWindow :last-child > span').html()))) {
     $('#chatWindow').append('<div class="poster">'+message['poster']+'</div><div class="message"><span>'+message['time']+'</span>'+message['message']+'</div>');
       }
       });
     }
     });

Без функции $ .each я могу успешно анализировать отдельные объекты JSON, но не массив. Это мой первый выход с JSON и $ .each, и я довольно новичок в jQuery, так что будьте спокойны, если в моем коде ужасные биты!

Ответы [ 10 ]

13 голосов
/ 22 октября 2009

Нет, с eval небезопасно, вы можете использовать гораздо более безопасный анализатор JSON: var myObject = JSON.parse(data); Для этого используйте lib https://github.com/douglascrockford/JSON-js

5 голосов
/ 02 декабря 2011

Я знаю, что это довольно долго после вашего сообщения, но я хотел опубликовать для тех, кто может столкнуться с этой проблемой, и наткнулся на это сообщение, как я.

Кажется, в jquery $.each есть что-то, что меняет природу элементов в массиве.

Я хотел сделать следующее: 

$.getJSON('/ajax/get_messages.php', function(data) {

    /* data: 

    [{"title":"Failure","details":"Unsuccessful. Please try again.","type":"error"},
    {"title":"Information Message","details":"A basic informational message - Please be aware","type":"info"}]

    */

    console.log ("Data0Title: " + data[0].title);
    // prints "Data0Title: Failure"

    console.log ("Data0Type: " + data[0].type);
    // prints "Data0Type: error"

    console.log ("Data0Details: " + data[0].details);
    // prints "Data0Details: Unsuccessful. Please try again"


    /* Loop through data array and print messages to console */

});

Чтобы выполнить цикл, я сначала попытался использовать jquery $.each для циклического перемещения по массиву данных. Однако, как отмечает ОП, это работает неправильно: 

$.each(data, function(nextMsg) {    
    console.log (nextMsg.title + " (" + nextMsg.type + "): " + nextMsg.details);
    // prints 
    // "undefined (undefined): undefined
    // "undefined (undefined): undefined
});

Это не совсем имело смысл, так как я могу получить доступ к элементам data[0] при использовании числового ключа в массиве данных. Так как использование числового индекса сработало, я попытался (успешно) заменить блок $.each на цикл for: 

var i=0;
for (i=0;i<data.length;i++){
    console.log (data[i].title + " (" + data[i].type + "): " + data[i].details);
    // prints
    // "Failure (error): Unsuccessful. Please try again"
    // "Information Message (info): A basic informational message - Please be aware"
}

Так что я не знаю основной проблемы, базовый, старомодный javascript для цикла кажется функциональной альтернативой jquery $.each

4 голосов
/ 30 октября 2010

jQuery.parseJSON - новое в jQuery 1.4.1

2 голосов
/ 14 июля 2012

Использование .NET 3.5 FIX

Вы все немного ошибаетесь, но комбинация всех ваших усилий окупилась!

вместо eval ('([' + jsonData + '])'); делать 

success: function(msg){
var data = eval(msg.d);
var i=0;
for(i=0;i<data.length;i++){
    data[i].parametername /// do whatever you want here.
};

Я ничего не знаю о целом "не используйте eval", но я знаю, что, выполняя '([' + msg + '])', вы вкладываете эти объекты глубже, вместо до уровня.

2 голосов
/ 04 июня 2012

Я пытаюсь проанализировать данные JSON, возвращенные при вызове ajax, и у меня работает следующее:

Пример PHP-кода 

$portfolio_array= Array('desc'=>'This is test description1','item1'=>'1.jpg','item2'=>'2.jpg');

echo json_encode($portfolio_array);

А в .js я разбираю вот так: 

var req=$.post("json.php", { id: "" + id + ""},
function(data) {
    data=$.parseJSON(data);
    alert(data.desc);
    $.each(data, function(i,item){
    alert(item);
    });
})
.success(function(){})
.error(function(){alert('There was problem loading portfolio details.');})
.complete(function(){});

Если у вас есть многомерный массив, как показано ниже 

$portfolio_array= Array('desc'=>'This is test description 1','items'=> array('item1'=>'1.jpg','item2'=>'2.jpg'));
echo json_encode($portfolio_array);

Тогда код ниже должен работать: 

var req=$.post("json.php", { id: "" + id + 
    function(data) {
    data=$.parseJSON(data);
    alert(data.desc);
    $.each(data.items, function(i,item){
    alert(item);
    });
})
.success(function(){})
.error(function(){alert('There was problem loading portfolio details.');})
.complete(function(){});

Обратите внимание, что ключ подмассива здесь - элементы, и предположим, что если у вас есть xyz, то вместо data.items используйте data.xyz

1 голос
/ 22 октября 2009

Осторожно с eval, спецификации JSON http://json.org/js.html рекомендуют что-то вроде 

var myObject = eval('(' + myJSONtext + ')');

И, возможно, есть еще несколько ошибок. Существует плагин для jQuery, который позаботится об этом, я думаю:

http://code.google.com/p/jquery-json/

0 голосов
/ 11 ноября 2009

НЕ оценивать. использовать реальный парсер, т.е. с json.org

0 голосов
/ 22 октября 2009

Вы можете скачать JSON-анализатор по ссылке на веб-сайте JSON.org , которая прекрасно работает, вы также можете записать свой JSON для просмотра содержимого.

Кроме того, если вы используете EVAL и это массив JSON, вам нужно использовать следующий синтакс:

eval('([' + jsonData + '])');

0 голосов
/ 22 октября 2009

Вы можете использовать функцию javascript eval () для анализа JSON за вас. См. веб-сайт JSON для более подробного объяснения, но вы сможете изменить свою функцию успеха на ... 

var returnedObjects = eval(data);
var i = 0;
for (i = 0; i < returnedObjects.length; i++){
    console.log('Time: ' + returnedObjects[i].time);
}

... или что-то близкое.

0 голосов
/ 22 октября 2009

Ваш data является строкой '[{}]' на тот момент времени, вы можете eval это так: 

function(data) {
    data = eval( '(' + data + ')' )
}

Однако этот метод далеко не безопасен, это будет немного больше работы, но лучше всего разобрать его с помощью анализатора JSON Крокфорда: https://github.com/douglascrockford/JSON-js

Другим методом будет $.getJSON, и вам нужно будет установить dataType в json для чисто зависимого от jQuery метода.

...