jQuery сумма событий по клику TD

Question

У меня есть простая таблица для имитации диаграммы Ганта. Идея состоит в том, что каждый щелчок TD запускает сумму значений, хранящихся в скрытом входном тексте (массив значений), доступном в TH (первый сын тега TR). Строка суммы этих значений показана на итоговой TD.

Далее кодовая таблица:

  <table width="100%" cellspacing="0" class="datagrid_ppal">
    <tbody>
      <tr class="encabezado">
        <th rowspan="2" scope="col" width="15%">Area</th>
        <th colspan="7" scope="col">Month</th>
      </tr>
      <tr class="encabezado">
        <th scope="col" width="2%">1</th>
        <th scope="col" width="2%">2</th>
        <th scope="col" width="2%">3</th>
        <th scope="col" width="2%">4</th>
        <th scope="col" width="2%">5</th>
        <th scope="col" width="2%">...</th>
        <th scope="col" width="2%">31</th>
      </tr>
      <tr>
        <th scope="row">Area 1<input name="line_config" type="hidden" value="0,5,50" /></th>
        <td class="gantt"> </td>
        <td class="gantt"> </td>
        <td class="gantt"> </td>
        <td class="gantt"> </td>
        <td class="gantt"> </td>
        <td class="gantt">...</td>
        <td class="gantt"> </td>
      </tr>
      <tr>
        <th scope="row">Area 2 <input name="line_config" type="hidden" value="0,0,10" /></th>
        <td class="gantt"> </td>
        <td class="gantt"> </td>
        <td class="gantt"> </td>
        <td class="gantt"> </td>
        <td class="gantt"> </td>
        <td class="gantt">...</td>
        <td class="gantt"> </td>
      </tr>
      <tr class="encabezado">
        <th scope="row">Total</th>
        <td class="total_dia"> </td>
        <td class="total_dia"> </td>
        <td class="total_dia"> </td>
        <td class="total_dia"> </td>
        <td class="total_dia"> </td>
        <td class="total_dia">...</td>
        <td class="total_dia"> </td>
      </tr>
    </tbody>
  </table>

Массив значений работает следующим образом: массив [0]: выключен; массив [1]: предоперационный; массив [2]: рабочий.

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

$(document).ready(function() {
    $('td.gantt').click(function() {
        $(this).toggleClass('preop');
    });
    $('td.gantt').dblclick(function() {
        $(this).toggleClass('operating');
    });
});

Неактивный TD всегда суммируется с суммой. Что я хочу сделать? Просто: 1. jQuery всегда суммирует входное значение TH [0], если TD не нажат (неактивен). 2. Когда я щелкаю или дважды щелкаю, TD.gantt jQuery получает входное значение TH [1] и добавляет его к итоговому значению.

Если кто-нибудь может помочь со всей проблемой, о, особенно, я был бы очень признателен.

Answer 1

Смешение "click" и "dblclick" не будет работать, по крайней мере, ненадежно.Я предлагаю вам переработать взаимодействие так, чтобы «щелчок» циклически проходил через ваши три различных состояния.

Чтобы выполнить математику, которую вы хотите выполнить (а я не до конца понимаю это), основная проблема состоит в том, чтобыполучите содержимое <th>, соответствующее столбцу, в котором находится каждый нажатый <td>. Чтобы получить это, вам нужно будет найти, какой дочерний элемент <td> является его родителем <tr>, и тогда это позволит вамнайти <th> (с помощью селектора ": nth-child" или фильтра "eq").