2015-10-06 38 views
0

嗨每個人我已經寫了一個代碼來生成從JSON文件使用jQuery的HTML表。但是當我刪除alert()函數時代碼不起作用。請幫我解決這個問題。感謝大家提前jQuery不工作沒有Alert()

貝婁是我的代碼

<script> 
var a = {}; 
var b = {}; 
var i = 1; 
var inc = 0; 
var j = 9; 
$.getJSON(
    'JsonDataBlocks.json', 
    function(data) { 

     a = data; 

     $.each(a, function(idx, elem) { 
      alert(inc); 
      if (idx == 0) { 
       $('table#tbl TBODY') 
        .append('<tr class="treegrid-' + i + ' treegrid-expanded"><td>' + elem.Tops + '</td><td><input type="text" class="info" value="' + elem.Jacket + '" id="' + i + 'a"></input></td><td><input type="text" class="info" value="' + elem.Flap + '" id="' + i + 'b"></input></td><td><input type="text" class="info" value="' + elem.Premium + '" id="' + i + 'c"></input></td><td><input type="text" class="info" value="' + elem.NonPrint + '" id="' + i + 'd"></input></td><td><input type="text" class="info" value="' + elem.Regular + '" id="' + i + 'e"></input></td></tr>'); 
       i = i + 1; 

      } else { 
       $('table#tbl TBODY') 
        .append('<tr class="treegrid-' + i + ' treegrid-expanded" id="color"><td class="box">' + elem.Tops + '</td><td class="box"><input type="text" class="info" value="' + elem.Jacket + '" id="' + i + 'a"></input></td><td><input type="text" class="info" value="' + elem.Flap + '" id="' + i + 'b"></input></td><td><input type="text" class="info" value="' + elem.Premium + '" id="' + i + 'c"></input></td><td><input type="text" class="info" value="' + elem.NonPrint + '" id="' + i + 'd"></input></td><td><input type="text" class="info" value="' + elem.Regular + '" id="' + i + 'e"></input></td></tr>'); 

       $.getJSON('TOI.json', function(data) { 
        b = data; 

        $.each(b, function(index, elem) { 
         if (elem.node == i) { 
          $('table#tbl TBODY').append('<tr id="colorBreak1" class="treegrid-' + j + ' treegrid-parent-' + i + '" ><td>' + elem.Tops + '</td><td><input type="text" class="info" value="' + elem.Jacket + '" id="' + j + 'a"></input></td><td><input type="text" class="info" value="' + elem.Flap + '" id="' + j + 'b"></input></td><td><input type="text" class="info" value="' + elem.Premium + '" id="' + j + 'c"></input></td><td><input type="text" class="info" value="' + elem.NonPrint + '" id="' + j + 'd"></input></td><td><input type="text" class="info" value="' + elem.Regular + '" id="' + j + 'e"></input></td></tr>'); 

          j = j + 1; 
         } 
        }); 
        i = i + 1; 
       }); 
      } 
     }); 
    }); 
</script> 
<div id="scroll" class="col-xs-12"> 
    <table id="tbl" class="tree table table-striped table-bordered"> 
     <thead> 
      <tr> 
       <th class="header" href="">Tops</th> 
       <th class="header">Jacket</th> 
       <th class="header">Flap</th> 
       <th class="header">Premium</th> 
       <th class="header">Non Print</th> 
       <th class="header">Regular</th> 
     </thead> 
     <tbody></tbody> 
    </table> 
</div> 
</body> 

</html> 
+0

你是什麼意思**不工作**?介意解釋一下? –

+4

你知道getJSON是異步的嗎?循環不會等到getJSON調用完成。你需要重新思考你如何實現你的代碼。 – epascarello

回答

1

相反的:

$.getJSON(
'JsonDataBlocks.json', 
function(data) { 

使用:

$.getJSON('JsonDataBlocks.json') 
    .done(data) { ... } 

,並做你的後續$ .getJSON調用。 $ .getJSON是異步的,因此除非您在數據返回後實現它,否則依賴於數據的任何內容都不會起作用。