Я просто не могу заставить данные JSON отображаться

Question

Я все еще новичок в получении данных JSON и манипулирую им, будьте спокойны со мной. Кажется, я делаю успешный вызов данных, но перечисление полей возвращается с [объектом] вместо фактических полей. Это, наверное, что-то глупое, но я пробовал все варианты, о которых я могу думать, чтобы указать поля, и это просто вызывает ошибки в консоли.

Вы можете увидеть данные в формате JSON здесь: https://api.myjson.com/bins/10h45j.json

Любая идея, что я делаю неправильно здесь?

$(document).ready(function(){ 
 
    $("button").click(function(){ 
 
     $.getJSON("https://api.myjson.com/bins/10h45j.json", function(data){ 
 
      $.each(data.Luthiers, function(i, field){ 
 
       $("#cheetos").append(field + "<br />"); 
 
      }); 
 
     }); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<button>Get JSON data</button> 
 

 
<div id="cheetos"></div>

Answer 1

Вы также можете попробовать это:

$(document).ready(function(){ 
    $("button").click(function(){ 
     $.getJSON("https://api.myjson.com/bins/10h45j.json", function(data){ 
      $.each(data.Luthiers, function(field){ 
       $("#cheetos").append(field + "<br />"); 
      }); 
     }); 
    }); 
}); 

Answer 2

Добавить JSON.stringify для того, чтобы, ну, "stringify" объект JSON. Попробуйте сниппет ниже, вы увидите, что ваши данные печатаются так, как вы ожидаете :)

$(document).ready(function(){ 
 
    $("button").click(function(){ 
 
     $.getJSON("https://api.myjson.com/bins/10h45j.json", function(data){ 
 
      $.each(data.Luthiers, function(i, field){ 
 
       $("#cheetos").append(JSON.stringify(field) + "<br />"); // add JSON.stringify() 
 
      }); 
 
     }); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<button>Get JSON data</button> 
 

 
<div id="cheetos"></div>

Answer 3

Вы можете попробовать некоторые вещи например, , и здесь у вас есть возможность получить отдельные предметы.

$(document).ready(function(){ 
 
    $("button").click(function(){ 
 
     $.getJSON("https://api.myjson.com/bins/10h45j.json", function(data){ 
 
      $.each(data.Luthiers, function(i, field){ 
 
       $.each(field, function(j, subFields){ 
 
       \t $("#cheetos").append(subFields + "<br />"); 
 
      }); 
 
      }); 
 
     }); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<button>Get JSON data</button> 
 

 
<div id="cheetos"></div>