jQuery сумма ячеек строки дочерней таблицы в родительскую строку - PullRequest
Новая
       9

jQuery сумма ячеек строки дочерней таблицы в родительскую строку

0 голосов
/ 13 августа 2010

У меня есть HTML-таблица, похожая на этот упрощенный пример: 

<table>
  <tbody>
    <tr><th>Player</th><th>Score</th></tr>
    <tr><td>Jack</td><td>7</td></tr>
    <tr><td class="parent">Green Team</td><td></td></tr>
    <tr><td class="child">Mark</td><td>11</td></tr>
    <tr><td class="child">Tom</td><td>5</td></tr>
    <tr><td>Steven</td><td>8</td></tr>
    <tr><td>Greg</td><td>4</td></tr>
    <tr><td class="parent">Blue Team</td><td></td></tr>
    <tr><td class="child">Joe</td><td>10</td></tr>
    <tr><td class="child">Jill</td><td>12</td></tr>
    <tr><td class="child">Rachel</td><td>9</td></tr>
  </tbody>
</table>

Я пытаюсь закодировать необходимый jQuery для итерации по всем дочерним строкам родительского элемента, суммировать оценки и вставитьсумма в ячейку счета родителя.Строки, которые не связаны с родителем, следует пропускать / игнорировать.

После выполнения кода jQuery приведенную выше таблицу следует преобразовать в такую: 

<table>
  <tbody>
    <tr><th>Player</th><th>Score</th></tr>
    <tr><td>Jack</td><td>7</td></tr>
    <tr><td class="parent">Green Team</td><td>16</td></tr>
    <tr><td class="child">Mark</td><td>11</td></tr>
    <tr><td class="child">Tom</td><td>5</td></tr>
    <tr><td>Steven</td><td>8</td></tr>
    <tr><td>Greg</td><td>4</td></tr>
    <tr><td class="parent">Blue Team</td><td>31</td></tr>
    <tr><td class="child">Joe</td><td>10</td></tr>
    <tr><td class="child">Jill</td><td>12</td></tr>
    <tr><td class="child">Rachel</td><td>9</td></tr>
  </tbody>
</table>

Я не уверенлучший способ решить это.Есть идеи?

1 Ответ

2 голосов
/ 13 августа 2010

Вы можете сделать что-то вроде этого: 

$("tr:has(td.parent)").each(function() {
  var sum = 0;
  $(this).nextUntil(':not(:has(td.child))').children(':nth-child(2)').each(function() {
    sum += parseInt(this.innerHTML, 10);
  });
  $(this).children(':eq(1)').text(sum);
});

Вы можете попробовать здесь , это берет каждый <tr>, который содержит <td class="parent"> и идет с .nextUntil(), пока не найдет строку без <td class="child">.Для этих строк он проходит через вторую ячейку (:nth-child(2)) и добавляет значение к сумме.

...