цикл через JSON с нулевыми объектами

Question

У меня есть эта проблема с моим файлом JSON.

{"results" :[{ 
    "name" : "name1", 
    "type" :[{ 
     "id" : '2', 
    },{ 
     "id" : '1', 
    },{ 
     "id" : '4', 
    },{ 
     "id" : '6', 
    }], 
}], 
    "images" :[{ 
    "url" : "url0", 
    },{ 
    "url" : "url1", 
    },{ 
    "url" : "url2", 
    },{ 
    "url" : "url3", 
    },{ 
    "url" : "url4", 
}], 
},{ 
    "name" : "name2", 
    "type" :[{ 
    { 
     "id" : '25', 
    },{ 
     "id" : '123', 
    },{ 
     "id" : '423', 
    },{ 
     "id" : '346', 
    }], 
    "images" :[{ 
     "url" : "url0", 
    },{ 
     "url" : "url1", 
    }, 
    { 
     "url" : "url2", 
    }, 
    { 
     "url" : "url3", 
    },{ 
     "url" : "url4", 
    }], 
}, 
},{ 
    "name" : "name3", 
    "type" : null, 
"images" :null, 
},..... 
]} 

объект JSON выглядит следующим образом Когда я петля через это кайф мне, когда дело доходит до нулевой

for(var i = 0; i < results.length; i++){ 
    $('.results')append('<p class="liste">'+results[i].name+'</p><ul></ul>'); 
    $('.liste').prepend('<img src="'+results[i].images[1].url+'"'); 
    for(var j = 0; j < results[i].type.length; j++){ 
     $('.results ul').append('<li>'+results[i].type[j].id+'</li>'); 
    } 
} 

результат должен выглядеть примерно так

<div class="results"> 
    <img src="url1"><p>name1</p> 
     <ul> 
     <li>2</li> 
     <li>1</li> 
     <li>4</li> 
     <li>6</li> 
     </ul> 
    <img src="url1"><p>name2</p> 
     <ul> 
     </ul> 
    <img src="url1"><p>name3</p> 
     <ul> 
     <li>25</li> 
     <li>123</li> 
     <li>423</li> 
     <li>346</li> 
     </ul> 
</div> 

я попробовал

if(results[i].images != null){ 
    $('.liste').prepend('<img src="'+results[i].images[1].url+'">'); 
}else{ 
    $('.liste').prepend('<img src="some default image" width="170" height="170">'); 
} 
if(results[i].type != null){ 
for (var j = 0; j < results[i].type.length.length; j++) { 
    $('.album').append('<li>'+[i]+'-'+[j]+'-'+results[i].type.length[j].id+'</li>'); 
}; 

Это действительно беспорядочное изображение, которое появляется для каждого [i], и появляется первое [k], поскольку оно должно быть таким же, как и последнее [k] in в pre. [Я]

[i][j] 
    name1 
[0][0] 
[0][1] 
[0][2] 
[0][3] 
[1][0] 
    name2 
[1][0]  
...... 

Я надеюсь, что кто-то может помочь мне с этим

EDIT Я забыл все «тип» указаны под каждым именем.

Answer 1

JSON Указан недействительный, но, предполагая, что JSON выглядит следующим образом (в зависимости от текущего кода итерации):

var results = [{ 
    "name": "name1", 
    "type": [{ "id": '2'}, 
      { "id": '1'}, 
      { "id": '4'}, 
      { "id": '6'}], 
    "images": [{ "url": "url0" }, 
       { "url": "url1" }, 
       { "url": "url2" }, 
       { "url": "url3" }, 
       { "url": "url4" }], 
    }, { 
    "name": "name2", 
    "type": [{ "id": '25' }, 
      { "id": '123' }, 
      { "id": '423' }, 
      { "id": '346' }], 
    "images": [{ "url": "url0" }, 
       { "url": "url1" }, 
       { "url": "url2" }, 
       { "url": "url3" }, 
       { "url": "url4" }], 
    }, { 
    "name": "name3", 
    "type": null, 
    "images": null 
    }]; 

У вас есть несколько проблем с этим утверждением:

for(var i = 0; i < results.length; i++){ 
    $('.results')append('<p class="liste">'+results[i].name+'</p><ul></ul>'); 
    $('.liste').prepend('<img src="'+results[i].images[1].url+'"'); 
    for(var j = 0; j < results[i].type.length; j++){ 
     $('.results ul').append('<li>'+results[i].type[j].id+'</li>'); 
    } 
} 

• $ ('. Liste'). Prepend добавит предоставленный элемент в ВСЕ элементов с классом .liste. Каждый раз, когда вы добавляете новое изображение, все существующие элементы <p> получат его.
• $ ('. Results ul'). Append - см. Выше комментарий. Каждый раз, когда вы добавляете, все существующие элементы, которые будут совпадать, получат дополнительные, нежелательные значения.
• Значения type и images могут быть пустыми, и вы не предоставили никаких защитных мер в этом цикле.

Нечто подобное, учитывая предположение выше, будет работать лучше для вас:

Demo Fiddle

Код:

// Use a document fragment to avoid DOM updates in the loop 
var $fragment = $(document.createDocumentFragment()); 
for (var i = 0; i < results.length; i++) { 
    // If there is an image, add it 
    if(results[i].images) { 
     $fragment.append($('<img src="' + results[i].images[1].url + '"/>')); 
    } 

    $fragment.append($('<p class="liste">' + results[i].name + '</p>')); 

    // Keep track of the current UL so it can be appended to directly 
    var $curULTag = $('<ul></ul>').appendTo($fragment); 

    if(results[i].images && results[i].type) { 
     for (var j = 0; j < results[i].type.length; j++) { 
      // add the li to the current UL 
      $curULTag.append('<li>' + results[i].type[j].id + '</li>'); 
     } 
    } 
} 

// Append the full results 
$('.results').append($fragment); 

Результаты:

<div class="results"> 
    <img src="url1"> 
    <p class="liste">name1</p> 
    <ul> 
     <li>2</li> 
     <li>1</li> 
     <li>4</li> 
     <li>6</li> 
    </ul> 
    <img src="url1"> 
    <p class="liste">name2</p> 
    <ul> 
     <li>25</li> 
     <li>123</li> 
     <li>423</li> 
     <li>346</li> 
    </ul> 
    <p class="liste">name3</p> 
    <ul></ul> 
</div> 

Если мое предположение о J Структура SON, которую вы предоставили, неверна, вы можете скорректировать приведенный выше код, чтобы предоставить нужные результаты.

Answer 2

Начните с более четкой структурой кода, чтобы вы не заблудились слишком быстро ...

if (jsonData.results) 
{ 
    $.each(jsonData.results, function(obj) 
    { 
     // process obj.name if exists 
     // process obj.type if exists 
    }); 
} 

ли вы какие-либо сообщения об ошибках в консоли?