循環不會返回所有數據JavaScript

我有2個嵌套循環，第一個獲取狀態，第二個獲取狀態的引用。但是這些循環不會返回所有的州或城市，只是返回其中的一些。這是我的HTML5和JavaScript代碼循環不會返回所有數據JavaScript

<html > 
<head > 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Cities</title> 
</head> 
<body dir="rtl"> 
<nav class="current"> 
<button class='back' >Navigation</button> 
<h1>States</h1> 
</nav> 
<article id="main" class="current"> 
<section> 
    <ul class='list' role='list'> 
    <li class='comp' data-goto="Cairo"> 
     <div> 
     <h3>Cairo</h3> 
     </div> 
     <aside> 
     <span class='nav'></span> 
     </aside> 
    </li> 
</ul> 
</section> 
</article> 
<div id="placeholder"></div> 
<script language="javascript" type="text/javascript"> 

var City={"Cairo": 
[{"id":1,"name":"القاهرة","gov":"القاهرة","gov_id":"1"},{"id":8,"name":"الرحاب","gov":"القاهرة","gov_id":"1"},{"id":10,"name":"القاهرة الجديدة","gov":"القاهرة","gov_id":"1"},{"id":23,"name":"الشروق","gov":"القاهرة","gov_id":"1"},{"id":34,"name":"مدينة السلام","gov":"القاهرة","gov_id":"1"}], 
"Giza":[{"id":2,"name":"الجيزة","gov":"الجيزة","gov_id":"2"},{"id":9,"name":"الشيخ زايد","gov":"الجيزة","gov_id":"2"},{"id":13,"name":"6 أكتوبر","gov":"الجيزة","gov_id":"2"}], 
"Alexandria":[{"id":3,"name":"الاسكندرية","gov":"الاسكندرية","gov_id":"3"}], 
"Ismaïlia":[{"id":4,"name":"الاسماعيلية","gov":"الاسماعيلية","gov_id":"4"}], 
"Aswan":[{"id":5,"name":"اسوان","gov":"اسوان","gov_id":"5"}], 
"Asuit":[{"id":6,"name":"اسيوط","gov":"اسيوط","gov_id":"6"}], 
"Luxor":[{"id":7,"name":"الاقصر","gov":"الاقصر","gov_id":"7"},{"id":31,"name":"أدفو","gov":"الاقصر","gov_id":"7"}], 
"Red-Sea":[{"id":29,"name":"الغردقة","gov":"البحر الاحمر","gov_id":"8"}], 
"Beheira ":[{"id":11,"name":"رشيد","gov":"البحيرة","gov_id":"9"},{"id":16,"name":"دمنهور","gov":"البحيرة","gov_id":"9"}]}; 

    var mdata=""; 
Object.keys(City).forEach(function(value, key) { 
     mdata=mdata+"<article id='" + value + "' class='next'>"; 
     mdata=mdata+"<section>"; 
     mdata=mdata+"<ul id='blog-list' class='list'>"; 

     City[value].forEach(function(v, k) { 

     mdata=mdata+"<li class='comp' data-goto='detail'>"+ 
        "<table style='width: 100%' cellspacing='0' cellpadding='0'>"+ 
        "<tr>" + 
        "<td style='width:12%'><img src='images/vets/cat-icon.png' style='width:70%;height:60%' valign='middle'></td>"+ 
        "<td style='font-size:large;' valign='top'><h3>" + v.name + 
        "</h3></td></tr></table></li><aside><span class='nav'></span></aside>";          
     })     
     }); 
     mdata=mdata+"</ul>"; 
     mdata=mdata+"</section>"; 
     mdata=mdata+"</article>"; 
     document.getElementById("placeholder").innerHTML= mdata; 
     </script> 
</body> 
</html>

來源

2015-08-26 Ahmed Elshorbagy

你創造了很多article，section，並ul開始標記，然後只關閉它們一次。

將您的第一個forEach循環的結尾移動到剛剛關閉article標記之後，並在設置innerHTML之前。

來源

2015-08-26 23:09:33 TbWill4321

它的工作原理。謝謝 –

循環不會返回所有數據JavaScript

回答

相關問題