1
 <table> 
    <tr> 
     <td class="one">01</td > 
     <td class="two">02</td>
        <td class="three">03</td> 
     </tr > 
    <tr > 
        <td class="one">11</td>
        <td class="two">12</td>
        <td class="three">13</td> 
     </tr > 
    <tr >
        <td class="one">21</td> 
        <td class="two">22</td>
        <td class="three">23</td>
      </tr > 
    </table > 

Суть: при клике по любому td получать значение первого td в данной строке tr. Например: пользователь кликает по

  <td class="three">23</td> 

И мы получаем в переменную 21.

2 ответа 2

3

$(document).ready(function() {
  $('table').on('click', 'td', function() {
    tr = $(this).closest('tr');
    td_first = $('td:first', tr).text();
    $('#result').html(td_first);
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td class="one">01</td>
    <td class="two">02</td>
    <td class="three">03</td>
  </tr>
  <tr>
    <td class="one">11</td>
    <td class="two">12</td>
    <td class="three">13</td>
  </tr>
  <tr>
    <td class="one">21</td>
    <td class="two">22</td>
    <td class="three">23</td>
  </tr>
</table>
<div id="result"></div>

1
<script>
td = document.getElementsByTagName("td"); //получаем все ячейки
for (i = 0; i < td.length; i++) td[i].addEventListener('click', ClickTD, false); //привязываем к ячейкам наше событие

function ClickTD(e){ //е - событие, которое вызвало функцию, target - цель (элемент который вызвал событие), parentNode - родитель нашего элемента, children[0] - первый элемент в родителе
 alert(e.target.parentNode.children[0].innerHTML);
}
</script>
1
  • 1
    addEventListener в цикле - это нехорошо.
    – Qwertiy
    30 окт 2015 в 10:04

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.