jquery getJSON et $.chaque boucle dans tableau enfant pas lié à un parent de l'indice de

Je suis assez nouveau à jQuery et JSON et marque nouveau sur ce site.

J'essaie d'afficher des données à partir d'un fichier JSON à l'aide de jQuery.

JSON Exemple:

[
    {
        "show":"swim",
        "image": "Img1.jpg",
         "brands": 
                [
                {
                "brand":"Img 1 Company",
                "YAH": "Img 1 YAH"
                },
                {
                "brand":"Img 1 Company 2",
                "YAH": "Img 1 YAH 2"
                }
                ]
    },
    {
        "show":"swim",
        "image":"Img2.jpg",
        "brands": [
                {
                "brand":"Img 2 Company 1",
                "YAH": "Img 2 YAH 1"
                },
                {
                "brand":"Img 2 Company 2",
                "YAH": "Img 2 YAH 2"
                },
                {
                "brand":"Img 2 Company 3",
                "YAH": "Img 2 YAH 3"
                }
                ]
    },
    {
        "show":"resort",
        "image":"Img3.jpg",
        "brands": [
                {
                "brand":"Img 3 Company 1",
                "YAH": "Img 3 YAH 1"
                },
                {
                "brand":"Img 3 Company 2",
                "YAH": "Img 3 YAH 2"
                }
                ]
    }
]

Je veux bien les "marques" de la matrice de données, d'afficher uniquement avec l'objet parent.
Quand je l'affiche sur la console.journal c'est correct, mais quand je .ajouter répète toutes les marques de la matrice de données.
Il affiche correctement les images et les valeurs qu'il affiche toutes les données de la 'marques' tableau, mais répète les "marques" de la matrice de données.
Le résultat s'affiche comme ceci:

Img1.jpg

Img 1 Entreprise
Img 1 Entreprise 2
Img 2 Entreprise 1
Img 2 Entreprise 2
Img 2 Entreprise 3
Img 3 1
Img 3 En Compagnie De 2

Img2.jpg

Img 1 Entreprise 2
Img 2 Entreprise 1
Img 2 Entreprise 2
Img 2 Entreprise 3
Img 3 1
Img 3 En Compagnie De 2

Img3.jpg

Img 3 1
Img 3 En Compagnie De 2

Où le résultat doit être:

Img1.jpg

Img 1 Entreprise
Img 1 Entreprise 2

Img2.jpg

Img 2 Entreprise 1
Img 2 Entreprise 2
Img 2 Entreprise 3

Img3.jpg

Img 3 1
Img 3 En Compagnie De 2

Je ne peux pas comprendre comment faire les marques tableau affiche uniquement les données de l'objet parent.
c'est mon HTML et Script

<!DOCTYPE html>
<html lang="en">
<head>
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<meta charset="utf-8" /><body>
<div id="ImageGallery"></div> 

<script>
$.getJSON('js/data.json', function(json) {
   $.each(json,function(i, value){
       $('#ImageGallery').append('<p>'+ value.image + '</p><ul class="brands"></ul>');
     $.each(value.brands, function(index, obj){
        $('ul.brands').append('<li>'+ obj.brand +'</li>');
     })
        });
});
</script>
</body>

Merci!

OriginalL'auteur user1932852 | 2012-12-27

Avoir une référence à l'ul que vous venez de créer et appeler cela de la .chaque rappel.

$.each(json,function(i, value){
     $('#ImageGallery').append('<p>'+ value.image + '</p>');
     $ul = $('<ul class="brands"></ul>').appendTo('#ImageGallery');
     $.each(value.brands, function(index, obj){
        $ul.append('<li>'+ obj.brand +'</li>');
     })
});

Musa qu'il a fait. Merci beaucoup!
vous êtes les bienvenus

OriginalL'auteur Musa

Vous n'êtes pas en lui disant le conteneur spécifique pour ajouter les valeurs. Plusieurs listes non ordonnées sont sélectionnés et ajoutés à.

Essayez quelque chose comme:

$.getJSON('js/data.json', function(json) {
    $.each(json,function(i, value){
        $('#ImageGallery').append('<p>'+ value.image + '<ul class="brands"></ul></p>');
        $.each(value.brands, function(index, obj){
            $('#ImageGallery p:last').children('ul.brands').append('<li>'+ obj.brand +'</li>');
        })
    });
});

OriginalL'auteur vortextangent

Vous devez vous connecter pour publier un commentaire.