Javascript:For循环不起作用

时间:2017-07-06 03:32:31

标签: javascript for-loop dynamic datatables

所以我认为我的for循环在某处出现了问题......

我将所有类都放在一个单独的css文件中,所以我在前端正确地看到了DOM上的所有内容。

我的问题是我需要让第1行和第3行应用这个类,我可以让它工作:

<i class="fa fa fa-trophy fa-4" aria-hidden="true">

理论上,我应该有一个包含10行的动态数据表,我们的应用程序中的用户是第一到第十行。

第1-3行:用户分别排在第一,第二和第三位......因此他们获得了“fa-trophy”课程。

第4-10行:剩下的用户是否因此获得了“fa-user-circle-o”类。

我做错了什么?

Javascript:

for(var i = 0; i < data.leaderboards.length; i++){

        row = $('<div class="leaderboard-row">');
        row.append('<div class="user-circle"><i class="fa fa-user-circle-o fa-4" aria-hidden="true">' + '</i></div>');
        row.append('<div class="leaderboard-col col1">' + (i + 1) + '</div>');
        row.append('<div class="leaderboard-col col2"><span class="truncate">' + data.leaderboards[i].username + '</span></div>');
        row.append('<div class="leaderboard-col col3"><span class="truncate">' + data.leaderboards[i].win_amount.formatMoney(0, '.', ',') + '</span></div>');

        if(data.leaderboards[i].level_unlocked > _currLevel){
            row.append('<div class="leaderboard-col col4">Won Playing ' + data.leaderboards[i].game_name + '</div>');
        }
        else{
            row.append('<div class="leaderboard-col col4">Won Playing <a href="/game/' + data.leaderboards[i].game_slug + '">' + data.leaderboards[i].game_name + '</a></div>');
        }
        _table.append(row);
    }

1 个答案:

答案 0 :(得分:2)

为什么不在fa-trophy时分配i <= 2课程?像

这样的东西
if (i <= 2) {
    // assign fa-trophy class for the first 3 places
    row.append('<div class="user-circle"><i class="fa fa-trophy fa-4" aria-hidden="true">' + '</i></div>');
} else {
    // do something else with 4th place onwards
    row.append('<div class="user-circle"><i class="fa fa-user-circle-o fa-4" aria-hidden="true">' + '</i></div>');
}