2016-05-19 17 views
0

スクリプトを実行すると、コンソールにエラーが表示されず、行とセルが追加されません。複数行の結果が見つかった場合は、行とセルを追加する必要があります。エラーがありますか?これはコードの一部ですは、これが行とセルを表に追加しない理由を理解できません

var txt = ""; 
var i = 0;     

for (state in stateMiles) { 
    i++; 
    var x =(stateMiles[state]); 
    (stateMiles[state])= parseFloat(x); 

    function appendRow() { 

     var tbl = document.getElementById("table"), // table reference 
      row = tbl.insertRow(tbl.rows.length),  // append table row 
      i; 

     // insert table cells to the new row 
     for (i = 0; i < tbl.rows[0].cells.length; i++) { 
      createCell(row.insertCell(i), i, 'row'); 
     } 
    } 

    $("#results").append 
    $(".state" + i).append(state); 
    $(".mile" + i).append(stateMiles[state]); 
} 
+0

? – Barmar

+0

'$(" results ")とは何ですか?append'はどうするのですか?あなたは何を追加するかという議論をしていませんか? – Barmar

+0

なぜループ内で関数を定義しますか?ループの外で関数を定義し、ループ内で呼び出すだけです。 – Barmar

答えて

0

コードスニペットが混乱しています。あなたはforループの中で関数を宣言していますか?

しないでください。

これは、Angular、ReactなどのMVCスタイルライブラリがすべて優れていることのようなものですが、これを行うには、ここをクリックしてください。あなたは `appendRow()`を呼び出すん

<script type="text/javascript"> 
 
$(function() { 
 
    
 
    var stateMiles = [ 
 
    { 
 
     state: "CO", 
 
     miles: 5082 
 
    }, 
 
    { 
 
     state: "TX", 
 
     miles: 582085 
 
    }, 
 
    { 
 
     state: "IL", 
 
     miles: 9852 
 
    } 
 
    ]; 
 
    
 
    var tbody = $("#my_table tbody"); 
 
    for(state_idx in stateMiles) { 
 
    
 
    var state = stateMiles[ state_idx ]; 
 
    tbody.append($("#row_template").html().replace("{{state}}", state.state).replace("{{miles}}", state.miles)); 
 
    
 
    } 
 
    
 
}); 
 
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<html> 
 
    <body> 
 
    <table id="my_table"> 
 
     <thead> 
 
     <th>State</th> 
 
     <th>Miles</th> 
 
     </thead> 
 
     <tbody> 
 
     
 
     </tbody> 
 
    </table> 
 
    
 
    <script type="text/html" id="row_template"> 
 
     <tr> 
 
     <td>{{state}}</td> 
 
     <td>{{miles}}</td> 
 
     </tr> 
 
    </script> 
 

 
    </body> 
 
</html

関連する問題