Значения JSON показывают NaN

Question

При получении данных массива JSON с использованием метода $ .each я могу получить значения массива, но кроме этого он показывает значения «NaN» и показывает ошибку ниже.

"Uncaught TypeError: Невозможно использовать оператор 'in' для поиска '5' в Hello!"

Кажется, что он перебирает все объекты не только массива, если это так, как я могу получить только значения массива и как я могу получить все значения (включая и исключая значения массива).

еще один запрос делает это rawgit работы для единственного метода 'GET', потому что при использовании метода 'POST' метанием ошибки (403 (Запрещено)).

$.ajax({ 
       method: 'GET', 
       url: 'https://rawgit.com/rajeshdesigner/testgit/master/colorsdata.json', 
       dataType: 'json', 
       success: function (data) { 
        $.each(data, function(index, obj){ 
         $.each(obj, function(index, element) { 
          $('#show-data').append(element.key + element.value + '<br/>'); 
         });    
        }); 
       } 
      }); 

JSON:

{ 
     "items": [ 
     { 
      "key": "First", 
      "value": 100 
     },{ 
      "key": "Second", 
      "value": 200 
     },{ 
      "key": "Last", 
      "value": "Mixed" 
     } 
     ], 
     "obj": { 
     "number": 1.2345e-6, 
     "enabled": true 
     }, 
     "message": "Hello!" 
    } 

Answer 1

Это звучит, как вы только хотите перебрать data.items но вы итерацию над всем. Попробуйте это:

$.each(data.items, function(index, obj) { 
    $('#show-data').append(obj.key + obj.value + '<br/>'); 
}); 

https://jsfiddle.net/rrsku4Lq/

Answer 2

Проблема заключается в том, когда второй цикл достигает "message": "Hello!", что это не объект, который будет петельные снова, так что для этого элемента требуется только первый цикл.

Чтобы исправить, просто введите оператор if, чтобы ввести второй цикл только в том случае, если obj является объектом.
Я также изменил вложенную петлю index на имя index2.

$.each(data, function(index, obj){ 
    // Only do nested loop if obj is Object 
    if (obj instanceof Object) { 
     $.each(obj, function(index2, element) { 
      $('#show-data').append(element.key + element.value + '<br/>'); 
     });    
    } 
}); 

Если вы заинтересованы только в data.items, чем вы можете использовать

$.each(data.items, function(index2, element) { 
    $('#show-data').append(element.key + element.value + '<br/>'); 
});    

Answer 3

У вас есть ненужный цикл. Ответ - это один объект JSON в вашем случае. Вам просто нужно перебирать элементы данных. ОБНОВЛЕНИЕ: как вы обрабатываете ответ, зависит от того, что вы хотите выполнить. На практике, как правило, вы будете знать, как получить доступ к данным необходимо от ответа, но как и другие предложили, вы можете перебирать ключи в объекте ответа и проверьте типы

var object = { 
 
    arr : [1,2,3], 
 
    nestedObject : { } 
 
}; 
 

 
for (var key in object) { 
 
    console.log(key); 
 
    console.log('Is array? ' + Array.isArray(object[key])); 
 
    // Now you can handle the data based on it's type... 
 
}

В этом случае вы можете ожидать, что ответ будет включать в себя ключ items и перебрать его. (Это также хорошая практика, чтобы подтвердить, что вы можете обработать ответ)

$.ajax({ 
 
    method: 'GET', 
 
    url: 'https://rawgit.com/rajeshdesigner/testgit/master/colorsdata.json', 
 
    dataType: 'json', 
 
    success: function(data) { 
 
    // data is your JSON object. 
 
    data.items.forEach(function(item) { 
 
     $('#show-data').append(item.key + item.value + '<br/>'); 
 
    }); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="show-data"></div>

Кроме того, 403 указывает на то, что ресурс заблокирован для текущего пользователя. Убедитесь, что ваш метод POST является общедоступным и у вас есть разрешение на выполнение запроса.

Answer 4

Вы должны сначала разобрать json.И, как сказал @Jason P итерацию data.items

$.ajax({ 
     method: 'GET', 
     url: 'https://rawgit.com/rajeshdesigner/testgit/master/colorsdata.json', 
     dataType: 'json', 
     success: function (data) { 
      var parsedData = $.parseJSON(data); 
      $.each(parsedData.items, function(index, obj){ 
       $.each(obj, function(index, element) { 
        $('#show-data').append(element.key + element.value + '<br/>'); 
       });    
      }); 
     } 
}); 

Answer 5

Вы пробегаем по всем элементам массива. Я думаю, вам нужно пропустить только элемент «items», поскольку только этот элемент содержит элементы «ключ» и «значение».

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

  $.ajax({ 
       method: 'GET', 
       url: 'https://rawgit.com/rajeshdesigner/testgit/master/colorsdata.json', 
       dataType: 'json', 
       success: function (data) 
       { 
        $.each(data, function(index, obj) 
        { 
         $.each(obj, function(index, element) 
         { 
          if(element.hasProperty('key') && element.hasProperty('value')) 
           $('#show-data').append(element.key + element.value + '<br/>'); 
         });    
        }); 
       } 
      }); 

Answer 6

$.ajax({ method: 'GET', url: 'https://rawgit.com/rajeshdesigner/testgit/master/colorsdata.json', dataType: 'json', success: function (data) { console.log(data.items); $.each(data.items, function(index, element) { $('#show-data').append(element.key + element.value + '<br/>'); }); } });