在Html頁面顯示來自Json的字符串

我想要在HTML頁面的表格中顯示來自Json（包含字符串列表）的字符串。所以我嘗試了Ajax和jQuery，但它不能正常工作。這是我的javascript代碼：在Html頁面顯示來自Json的字符串

$(document).ready(function(){ 

$.ajax({ 

    url: '/generiereBestenliste/AddE', 
    method: 'POST', 
    dataType: "json", 


    success: function (json) { 

     $("name1").text(json[0]); 
     $("score1").text(json[1]); 
     $("name2").text(json[2]); 
     $("score2").text(json[3]); 
     $("name3").text(json[4]); 
     $("score3").text(json[5]); 
     $("name4").text(json[6]); 
     $("score4").text(json[7]); 
     $("name5").text(json[8]); 
     $("score5").text(json[9]); 
     $("name6").text(json[10]); 
     $("score6").text(json[11]); 
     $("name7").text(json[12]); 
     $("score7").text(json[13]); 
     $("name8").text(json[14]); 
     $("score8").text(json[15]); 
     $("name9").text(json[16]); 
     $("score9").text(json[17]); 
     $("name10").text(json[18]); 
     $("score10").text(json[19]); 
     $("nameDu").text(json[20]); 
     $("scoreDu").text(json[21]); 


    } 

}); 


});

這我的html頁面：

@main("bestenlisteAddE"){ 
<link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'> 
<script src="@routes.Assets.versioned("javascripts/bestenlisteAddE.js")"></script> 

<html lang="en"> 
    <head> 
     <meta charset="UTF-8"> 
     <title>bestenlisteAddE</title> 
    </head> 

    <style> 
    *{font-family: 'Roboto', sans-serif;} 
    table, td { 
    border: 1px solid black; 
    } 
    td { 
    padding: 15px ; 
    } 
    </style> 
    <body> 

     <h1 align="center">Bestenliste Addition Leicht</h1> 

     <table align="center" border="1" style="width:20%"> 
      <tr id="1"> 
     <tr> 
      <th>Platz</th> 
      <th>Name</th> 
      <th>Score</th> 
     </tr> 
      <td>#1 
       <img src="/assets/images/pokalgold.png" 
       style="width:30px;height:30px;" 
       alt="gold"></td> 
      <td id="name1">Jill</td> 
      <td id="score1">50 
      </td> 
      </tr> 
      <tr id="2"> 
       <td>#2 
        <img src="/assets/images/pokalsilber.png" 
        style="width:30px;height:30px;" 
        alt="silber"></td> 
       <td id="name2">Eve</td> 
       <td id="score2">94 
       </td> 
      </tr> 

      <tr id="3"> 
       <td>#3 
        <img src="/assets/images/pokalbronze.png" 
        style="width:30px;height:30px;" 
        alt="bronze"></td> 
       <td id="name3">Jill</td> 
       <td id="score3">50 
       </td> 
      </tr> 
      <tr id="4"> 
       <td>#4</td> 
       <td id="name4">Eve</td> 
       <td id="score4">94</td> 
      </tr> 

      <tr 
      id="5"> 
       <td>#5</td> 
       <td id="name5">Jill</td> 
       <td id="score5">50</td> 
      </tr> 
      <tr id="6"> 
       <td>#6</td> 
       <td id="name6">Eve</td> 
       <td id="score6">94</td> 
      </tr> 

      <tr id="7"> 
       <td>#7</td> 
       <td id="name7">Jill</td> 
       <td id="score7">50</td> 
      </tr> 
      <tr id="8"> 
       <td>#8</td> 
       <td id="name8">Eve</td> 
       <td id="score8">94</td> 
      </tr> 

      <tr id="9"> 
       <td>#9</td> 
       <td id="name9">Jill</td> 
       <td id="score9">50</td> 
      </tr> 
      <tr id="10"> 
       <td>#10</td> 
       <td id="name10">Eve</td> 
       <td id="score10">94</td> 
      </tr> 
      <tr id="du"> 
       <td>Du:</td> 
       <td id="nameDu">Benutzername</td> 
       <td id="scoreDu">0</td> 

      </tr> 
     </table> 
    </body> 

</html> 
}

來源

2016-03-15 Julio

$("name1").text(json[0]);

到

$("#name1").text(json[0]);

同樣爲所有的人，你就忘記#。

來源

2016-03-15 11:27:41

ooops，謝謝!!! – Julio

在Html頁面顯示來自Json的字符串

回答

相關問題