#jquery #json #object
#jquery #json #объект
Вопрос:
у меня есть json / object, подобный этому
{city: "bangalore", other:"other data", pic: "bangalore.jpg",city: "delhi", pic: "delhi.jpg"}
у меня есть 2 города и его изображение. я хочу добавить их в отдельные 2 div.
здесь я пытаюсь перебирать только каждый город? но не удалось, как я могу это сделать?
$.ajax({
url: "mul.php",
type: "POST",
data: {
a: a
},
dataType: "text",
success: function(data) {
var obj = $.parseJSON(data);
console.log(obj.city); // i'm getting only delhi , what about bangalore?
$.each(obj.city, function(i, city) {
console.log(city); // i'm getting error
})
}
});
Комментарии:
1. в одном объекте несколько ключей не могут иметь одно и то же имя. Создайте массив объектов следующим образом
[ { "city": "bangalore", "other": "other data", "pic": "bangalore.jpg" }, { "city": "delhi", "pic": "delhi.jpg" } ]
2. хорошо, в этом случае, как я могу их зациклить
3. Вы можете узнать, какой город сопоставлен с каким рисунком. Вам нужно иметь массив городов, чтобы выполнить для каждого
Ответ №1:
Создайте массив объектов, подобных этому.
Ключи объекта нельзя дублировать.
[
{
"city": "bangalore",
"other": "other data",
"pic": "bangalore.jpg"
},
{
"city": "delhi",
"pic": "delhi.jpg"
}
]
Ответ №2:
Как уже говорили другие, вам нужно поместить каждый город в отдельный объект внутри массива. Ключи объекта нельзя дублировать, и даже если бы это было как-то законно, как бы вы узнали, какая картинка была связана с каким городом? После того, как вы разделили города с их изображениями на отдельные объекты, вы можете перебирать их с помощью доступа к city
свойству каждого объекта в массиве. Обратите внимание, что первым переданным аргументом $.each()
является сам массив или объект, а не свойство, которое вы хотите отобразить:
var arr = [
{
"city": "bangalore",
"other": "other data",
"pic": "bangalore.jpg"
},
{
"city": "delhi",
"pic": "delhi.jpg"
}
];
$.each(arr, function(i, obj) {
console.log(obj.city);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>