Получение nth-child родителя

Question

У меня есть таблица, где мне нужны первые две ячейки каждой строки, которые можно кликать (НЕ вся строка). Когда я нажимаю первую или ячейку seccond, я хочу получить значение третьей ячейки той же строки. Чтобы уточнить, когда я нажимаю a1 Я хочу, чтобы предупреждение показывало c1. Если я нажму b2, я хочу, чтобы он показывал c2, и если я нажму c3 Я не хочу, чтобы что-то произошло.

Как вы можете видеть, мой alert($(this).parent(':nth-child(3)').text()); не работает .. как я могу это достичь?

$('td:nth-child(-n+2)').on("click", function(){ 
 
    alert($(this).parent(':nth-child(3)').text()); //Doesn't work 
 
});

td{ 
 
    border: 1px solid black; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
 
<table> 
 
    <tr> 
 
     <td>a1</td> 
 
     <td>b1</td> 
 
     <td>c1</td> 
 
    </tr> 
 
    <tr> 
 
     <td>a2</td> 
 
     <td>b2</td> 
 
     <td>c2</td> 
 
    </tr> 
 
    <tr> 
 
     <td>a3</td> 
 
     <td>b3</td> 
 
     <td>c3</td> 
 
    </tr> 
 
</table>

Answer 1

вам нужно использовать .closest('tr') .. выбрать родительскую тр и .find() выбрать td:nth-child(3)

$('td:nth-child(-n+2)').on("click", function(){ 
    alert($(this).closest('tr').find('td:nth-child(3)').text()); 
}); 

Working Demo

Answer 2

Вы можете использовать

$('td:lt(2)').on("click", function() { 
    alert($(this).parent().find("td:eq(2)").text()); //Doesn't work 
}); 

Fiddle

• lt(2) получит указанные элементы, индекс меньше 2
• eq(2) будет выбрать элемент, индекс которого равен 2

Answer 3

Используйте этот

$(this).parent().children(':nth-child(3)').text() 

Выберите a pa а затем ребенок.

JsFiddle

Answer 4

Эта работа для меня:

$('table tr').each(function(){ 
    $(this).find('td:lt(2)').on("click", function() { 
      var text = $(this).parent().find("td:eq(2)").text(); 
      console.log(text); 
    }); 
});