Javascript中ID和for循环的问题

时间：2014-11-21 22:49:18

标签： javascript jquery 

$(document).ready(function() {
  var week = 5;
  var players = 8;
  var numbers = [];
  var array = [];
  for (o = 0; o < players; o++) {
    for (i = 0; i < week + 1; i++) {
      var improved = i + 1;
      var oString = o.toString();
      var iString = i.toString();
      var id = "#" + oString + iString;
      var rawText = $(id).text();
      var refined = Number(rawText);
      array.push(refined);
    }
    numbers.push(array);
    array = [];
  }
  for (p = 0; i < numbers.length; p++) {
    var total1 = 0;
    $.each(numbers[0], function() {
      total1 += this;
    });
  }
  $("#total1").text(total1);
  for (p = 0; i < numbers.length; p++) {
    var total2 = 0;
    $.each(numbers[0], function() {
      total2 += this;
    });
  }
  $("#total2").text(total2);
  for (p = 0; i < numbers.length; p++) {
    var total3 = 0;
    $.each(numbers[0], function() {
      total3 += this;
    });
  }
  $("#total3").text(total3);
  for (p = 0; i < numbers.length; p++) {
    var total4 = 0;
    $.each(numbers[0], function() {
      total4 += this;
    });
  }
  $("#total4").text(total4);
  for (p = 0; i < numbers.length; p++) {
    var total5 = 0;
    $.each(numbers[0], function() {
      total5 += this;
    });
  }
  $("#total5").text(total5);
  var total = total1 + total2 + total3 + total4 + total5;
  $("#total").text(total);
});
<!DOCTYPE html>
<html>

<head>
  <title></title>
  <meta charset="utf-8">

  <script src="jquery-1.11.1.min.js"></script>
  <script src="main.js"></script>


  <link rel="stylesheet" href="style2.css">

  <link rel="shortcut icon" href="../favicon.ico" type="image/x-icon">
  <link rel="icon" href="../favicon.ico" type="image/x-icon">
</head>

<body>
  <table>
    <tr>
      <th>Player</th>
      <th>Position</th>
      <th>Week 7</th>
      <th>Week 8</th>
      <th>Week 9</th>
      <th>Week 10</th>
      <th>Week 11</th>
    </tr>
    <tr>
      <td>Matt Ryan</td>
      <td>QB</td>
      <td id="01">11</td>
      <td id="02">15</td>
      <td id="03">00</td>
      <td id="04">14</td>
      <td id="05">14</td>
    </tr>
    <tr>
      <td>Marshawn Lynch</td>
      <td>RB</td>
      <td id="11">06</td>
      <td id="12">01</td>
      <td id="13">09</td>
      <td id="14">40</td>
      <td id="15">12</td>
    </tr>
    <tr>
      <td>Calvin Johsnon</td>
      <td>WR</td>
      <td id="21">00</td>
      <td id="22">00</td>
      <td id="23">00</td>
      <td id="24">00</td>
      <td id="25">00</td>
    </tr>
    <tr>
      <td>Allen Hurns</td>
      <td>WR</td>
      <td id="31">00</td>
      <td id="32">04</td>
      <td id="33">23</td>
      <td id="34">17</td>
      <td id="35">05</td>
    </tr>
    <tr>
      <td>A.J. Green</td>
      <td>WR</td>
      <td id="41">00</td>
      <td id="42">00</td>
      <td id="43">10</td>
      <td id="44">02</td>
      <td id="45">18</td>
    </tr>
    <tr>
      <td>Julius Thomas</td>
      <td>Tight End</td>
      <td id="51">02</td>
      <td id="52">02</td>
      <td id="53">09</td>
      <td id="54">18</td>
      <td id="55">00</td>
    </tr>
    <tr>
      <td>Matt Bryant</td>
      <td>Kicker</td>
      <td id="61">00</td>
      <td id="62">03</td>
      <td id="63">00</td>
      <td id="64">15</td>
      <td id="65">15</td>
    </tr>
    <tr>
      <td>Texans</td>
      <td>Defense</td>
      <td id="71">04</td>
      <td id="72">07</td>
      <td id="73">12</td>
      <td id="74">00</td>
      <td id="75">08</td>
    </tr>
    <tr>
      <td>Total:</td>
      <td></td>
      <td id="total1">00</td>
      <td id="total2">00</td>
      <td id="total3">00</td>
      <td id="total4">00</td>
      <td id="total5">00</td>
    </tr>
  </table>
  <p>Total: <span id="totalAll"></span>
  </p>
</body>

</html>

最近，我被指控为我的朋友群创建一个梦幻足球网站，拥有最少的Javascript和HTML体验。我不介意从NFL网站手动输入数据，但我认为让脚本自动添加表格中的数字会很酷。但是，我写的代码不起作用。我不认识任何人对计算机科学有任何了解，并且我在整个过程中都转向Google。浏览器控制台不返回任何错误。我期望发生的是每周我所有tds的总积分到底部的总周数，然后将总周数加到最终总数中。真正发生的事情是什么。有一半时间，当我改变某些东西时，页面崩溃了。

我似乎无法让JSfiddle运行而不会在运行时崩溃，所以我把它放入pastebin http://pastebin.com/Wb3ENMZY

最后的所有for循环都是临时的，当第一部分工作时将被删除。

1 个答案:

答案 0 :(得分：0)

不太清楚为什么你的代码在JSFiddle中不起作用 这里有一个关于你想要完成的工作案例的小提琴Demo

<强> HTML 

<table>
    <thead>
    <tr>
        <th>Player</th>
        <th>Position</th>
        <th>Week 7</th>
        <th>Week 8</th>
        <th>Week 9</th>
        <th>Week 10</th>
        <th>Week 11</th>
    </tr>
        <thead>
            <tbody>
    <tr>
        <td>Matt Ryan</td>
        <td>QB</td>
        <td id="01">11</td>
        <td id="02">15</td>
        <td id="03">00</td>
        <td id="04">14</td>
        <td id="05">14</td>
    </tr>
    <tr>
        <td>Marshawn Lynch</td>
        <td>RB</td>
        <td id="11">06</td>
        <td id="12">01</td>
        <td id="13">09</td>
        <td id="14">40</td>
        <td id="15">12</td>
    </tr>
    <tr>
        <td>Calvin Johsnon</td>
        <td>WR</td>
        <td id="21">00</td>
        <td id="22">00</td>
        <td id="23">00</td>
        <td id="24">00</td>
        <td id="25">00</td>
    </tr>
    <tr>
        <td>Allen Hurns</td>
        <td>WR</td>
        <td id="31">00</td>
        <td id="32">04</td>
        <td id="33">23</td>
        <td id="34">17</td>
        <td id="35">05</td>
    </tr>
    <tr>
        <td>A.J. Green</td>
        <td>WR</td>
        <td id="41">00</td>
        <td id="42">00</td>
        <td id="43">10</td>
        <td id="44">02</td>
        <td id="45">18</td>
    </tr>
    <tr>
        <td>Julius Thomas</td>
        <td>Tight End</td>
        <td id="51">02</td>
        <td id="52">02</td>
        <td id="53">09</td>
        <td id="54">18</td>
        <td id="55">00</td>
    </tr>
    <tr>
        <td>Matt Bryant</td>
        <td>Kicker</td>
        <td id="61">00</td>
        <td id="62">03</td>
        <td id="63">00</td>
        <td id="64">15</td>
        <td id="65">15</td>
    </tr>
    <tr>
        <td>Texans</td>
        <td>Defense</td>
        <td id="71">04</td>
        <td id="72">07</td>
        <td id="73">12</td>
        <td id="74">00</td>
        <td id="75">08</td>
    </tr>
    <tr>
        <td>Total:</td>
        <td></td>
        <td id="total1">00</td>
        <td id="total2">00</td>
        <td id="total3">00</td>
        <td id="total4">00</td>
        <td id="total5">00</td>
    </tr>
            </tbody>
</table>
<p>Total: <span id="totalAll"></span>
</p>

注意添加<thead>和<tbody>这样我们可以轻松地在JQuery中选择正文行

<强>代码 

//Make a list of values for each column
var sums = [0,0,0,0,0];

//Go through each row in the body of the table
$("tbody tr").each(function () {
    //We start at 2 because thats the firs of the weeks columns
    for(var i = 2; i <= 6; i++)
    {
        //Add the current column's value to the sum. Note we use :eq() selector to get the i'th column
        sums[i-2] += parseInt($("td:eq("+i+")", this).html());
    }
});

var total = 0;

//Go through each column sum totalling it and writing it to the appropriate column
for(var i = 0; i < sums.length; i++)
{
    total += sums[i];
    $("#total" + (i + 1)).html(sums[i]);
}

//Write the total
$("#totalAll").html(total);

来自原始代码

for (p = 0; i < numbers.length; p++) {
    var total1 = 0;
    $.each(numbers[0], function() {
      total1 += this;
    });
  }

这导致Javascript永远循环。您的for循环将循环到i < numbers.length，但i未在此处定义。你可能意味着p。将i替换为p后，它不再永久循环，但每列的值都相同，应为您要解析的每列更改numbers[0]。 即使修复了这些错误，我仍然遇到原始代码问题。

相关问题
最新问题