在分数表上获得胜利,领带,失败的结果

时间:2012-11-29 22:54:45

标签: jquery html-table compare

从DB打印的动态数据/表格。需要多少次团队 WON,TIED,LOST。 jQuery的新手并不知道如何开始编码(?!)。我想第一次看到切尔西出现的那一行,然后比较得分,使用数组存储W,T,L - 并在结尾打印结果(?)。

这就是表格的样子:

<table>
<tr id="12">
   <td class="238 ekipi_1">Chelsea</td>
   <td class="231 ekipi_2">ManU</td>
   <td class="goals_238">4</td>
   <td class="goals_231">2</td>
</tr>

<tr id="13">
   <td class="242 ekipi_1">Reading</td>
   <td class="238 ekipi_2">Chelsea</td>
   <td class="goals_242">3</td>
   <td class="goals_238">3</td>
</tr>

<tr id="16">
   <td class="251 ekipi_1">Swansea</td>
   <td class="238 ekipi_2">Chelsea</td>
   <td class="goals_251">5</td>
   <td class="goals_238">3</td>
</tr>
</table>

结果将是:

          W   T   L

Chelsea | 1 | 1 | 1 |
Reading | 0 | 1 | 0 |
ManU    | 0 | 0 | 1 |

非常感谢任何有关先发制人的提示。

1 个答案:

答案 0 :(得分:1)

要读取初始数据并构建对象,您可以执行此操作..

    var teams = {
    "Chelsea": {"W": 0, "T": 0, "L": 0},
    "ManU": {"W": 0, "T": 0, "L": 0},
    "Reading": {"W": 0, "T": 0, "L": 0},
    "Swansea": {"W": 0, "T": 0, "L": 0}
};

$('table tr').each(function() {
    var $this = $(this);
    var team1 = $this.find('td:eq(0)').text();
    var team2 = $this.find('td:eq(1)').text();
    var score1 = $this.find('td:eq(2)').text();
    var score2 = $this.find('td:eq(3)').text();

    if(+score1 === +score2){
        teams[team1]["T"] =  +teams[team1]["T"] +1; 
        teams[team2]["T"] =  +teams[team2]["T"]+1; 
    }  
    else if(+score1 > +score2){
        teams[team1]["W"] =  +teams[team1]["W"]+1; 
        teams[team2]["L"] =  +teams[team2]["L"]+1; 
    }
    else{
        teams[team1]["L"] =  +teams[team1]["L"]+1; 
        teams[team2]["W"] =  +teams[team2]["W"]+1; 
    }        
});

// Print the data

$.each(teams, function(key,value){
    var $clone = $('#template');
    $clone.find('.team').html(key);
    $clone.find('.score:eq(0)').html(value["W"]);
    $clone.find('.score:eq(1)').html(value["T"]);   
    $clone.find('.score:eq(2)').html(value["L"]);
    $('#output').append($clone.html());
});

<强> Check Fiddle

您可以阅读团队对象,并在完成后将其打印出来。