从sql数据库中检索数据并将其显示在表中

时间:2018-03-12 16:56:09

标签: javascript html underscore.js

我正在尝试从数据库中检索团队列表,然后将其显示在表格中。我使用下划线和JavaScript。

HTML代码

<html>
<head>
    <script type="text/javascript" src="jquery-3.3.1.min.js"></script>
    <script type="text/javascript" src="underscore.js"></script>
    <script src="findPlayer.js" type="text/javascript"></script>
</head>

<body>
<a href="listTeams.html">Teams</a> | <a href="findPlayer.html">Find Player</a> 

<h1>Find Player [jQuery & UnderScore]</h1>

<hr>

Team Code:<input id="team" type="text" value="CLE">
Player Name:<input id="name" type="text" value="LeBron James">

<button id="find">Find</button>

<hr>

<table border=1>
    <tbody id="table">
        <tr><th>Team</th><th>Name</th><th>Age</th><th>Pts</th></tr>
    </tbody>
</table> 

</body>
</html>

ListTeams.js

$('document').ready(function(){
$.getJSON("getTeamData.php",function(data){
    console.log(data);
    _.each(data,function(element){
        $('#table').append('<tr><td>${element.NAME}</td></tr>');
    });
  });
});

这应该用30个NBA球队的名字在我的桌面上添加线条,但我实际得到的是其中包含${element.NAME}的行。

如何让我的代码正确显示团队名称?

1 个答案:

答案 0 :(得分:1)

您似乎想使用template literal将名称放在表格中。请注意,您必须使用反引号(`),而不是单引号(&#39;),如下所示:

$('document').ready(function(){
    $.getJSON("getTeamData.php",function(data){
        console.log(data);
        _.each(data,function(element){
            $('#table').append(`<tr><td>${element.NAME}</td></tr>`);
        });
    });
});

如果您不想使用模板文字,则必须将字符串与HTML连接起来,如下所示:

$('document').ready(function(){
    $.getJSON("getTeamData.php",function(data){
        console.log(data);
        _.each(data,function(element){
            $('#table').append('<tr><td>' + element.NAME + '</td></tr>');
        });
    });
});