-1

有人可以在下面的 jQuery 上帮助我吗？

我想根据第 1 场和第 2 场信息自动添加玩家的总得分、SR 等。

HTML

<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <th>Name</th>
    <th>Total Runs</th>
    <th>Total Balls</th>
    <th>Match 1 Runs</th>
    <th>Match 1 Balls</th>
    <th>Match 2 Runs</th>
    <th>Match 2 Balls</th>
    <th>Strite Rate</th>
  </tr>
  <tr>
    <td>Player 1</td>
    <td>Total Runs: <span class="player-stat-runs"></span></td>
    <td>Total Balls: <span class="player-stat-balls"></span></td>
    <td>15</td>
    <td>16</td>
    <td>20</td>
    <td>14</td>
    <td><span class="player-stat-avg"></span></td>
  </tr>
  <tr>
    <td>Player 2</td>
    <td>Total Runs: <span class="player-stat-runs"></span></td>
    <td>Total Balls: <span class="player-stat-balls"></span></td>
    <td>3</td>
    <td>4</td>
    <td>68</td>
    <td>94</td>
    <td><span class="player-stat-avg"></span></td>
  </tr>
</table>

CSS

table,th,td{border:1px solid #222;border-collapse:collapse;max-width:500px;}th{font-weight:bold;background:#efefef;}th,td{padding:5px;}
  1. 球员总跑数（第 1 场比赛 + 第 2 场比赛）
  2. 球员打出的总球数（第 1 场球+ 第 2 场球）
  3. 击球手击球率（PS：如果击球手从 10 个球中得分 10 次，SR = 100.00）

小提琴

4

1 回答 1

1

You can put class attributes for runs and balls tds, so that you can easily figure out the tds for calculations. See below table

<table class="table table-bordered">
  <tr>
    <th>Name</th>
    <th>Total Runs</th>
    <th>Total Balls</th>
    <th>M1 Runs</th>
    <th>M1 Balls</th>
    <th>M2 Runs</th>
    <th>M2 Balls</th>
    <th>Strite Rate</th>
  </tr>
<tbody>
  <tr>
    <td>Player 1</td>
    <td class="totalRuns">Total Runs: <span class="player-stat-runs"></span></td>
    <td class="totalBalls">Total Balls: <span class="player-stat-balls"></span></td>
    <td class="runs">15</td>
    <td class="balls">16</td>
    <td class="runs">20</td>
    <td class="balls">14</td>
    <td class="strikeRate"><span class="player-stat-avg"></span></td>
  </tr>
  <tr>
    <td>Player 2</td>
    <td class="totalRuns">Runs: <span class="player-stat-runs"></span></td>
    <td class="totalBalls">Balls: <span class="player-stat-balls"></span></td>
    <td class="runs">3</td>
    <td class="balls">4</td>
    <td class="runs">68</td>
    <td class="balls">94</td>
    <td class="strikeRate"><span class="player-stat-avg"></span></td>
  </tr>
    </tbody>
</table>

Now, use below jQuery to calculate total runs, balls and strike rate

$(function(){
    $('table.table.table-bordered tbody tr').each(function(){
       var totalRuns = 0;
       var totalBalls = 0;
        $(this).find('.runs').each(function(){
        totalRuns += parseInt($(this).text());
        });

        $(this).find('.balls').each(function(){
        totalBalls += parseInt($(this).text());
        });

       $(this).find('.totalRuns .player-stat-runs').text(totalRuns); 
       $(this).find('.totalBalls .player-stat-balls').text(totalBalls);
       $(this).find('.strikeRate .player-stat-avg').text(parseInt(totalRuns/totalBalls*100)); 

    });
});

JSFiddle Demo

于 2015-02-11T05:12:18.543 回答