JQuery - получить значение первого td в таблице

Я пытаюсь получить значение первого td в каждом tr, когда пользователи нажимают "click".

Результат ниже будет выводить aa, ee или ii. Я думал об использовании ближайшего ( "tr" ).. но он всегда выводит "Объект объекта". Не уверен, что делать с этим.

Мой html

<table>
<tr>
  <td>aa</td>
  <td>bb</td>
  <td>cc</td>
  <td>dd</td>
  <td><a href="#" class="hit">click</a></td>

</tr>
<tr>
  <td>ee</td>
  <td>ff</td>
  <td>gg</td>
  <td>hh</td>
  <td><a href="#" class="hit">click</a></td>
</tr>
<tr>
  <td>ii</td>
  <td>jj</td>
  <td>kk</td>
  <td>ll</td>
  <td><a href="#" class="hit">click</a></td>
</tr>

</table>

Jquery

$(".hit").click(function(){

 var value=$(this).// not sure what to do here

 alert(value)  ;

});

Ответы

Ответ 1

$(this).parent().siblings(":first").text()

parent дает ссылку <td> по ссылке,

siblings дает все теги <td> в том, что <tr>,

:first дает первый согласованный элемент в наборе.

text() содержит содержимое тега.

Ответ 2

Это должно работать:

$(".hit").click(function(){    
   var value=$(this).closest('tr').children('td:first').text();
   alert(value);    
});

Объяснение:

  • .closest('tr') получает ближайшего предка, который является элементом <tr> (так что в этом случае строка, где элемент <a> в).
  • .children('td:first') получает все дочерние элементы этого элемента, но с :first мы сводим его к первому элементу <td>.
  • .text() получает текст внутри элемента

Как вы можете видеть из других ответов, существует более чем один способ сделать это.

Ответ 3

В указанном выше случае вы можете выполнить манипуляцию с родителями/дочерними элементами.

$(this).parents("tr").children("td:first").text()

Ответ 4

$(".hit").click(function(){
   var values = [];
   var table = $(this).closest("table");
   table.find("tr").each(function() {
      values.push($(this).find("td:first").html());
   });

   alert(values);    
});

Вам следует избегать $(".hit"), это действительно неэффективно. Вместо этого попробуйте использовать делегирование событий.

Ответ 5

Установите firebug и используйте console.log вместо alert. Затем вы увидите точный элемент, к которому вы обращаетесь.

Ответ 6

Если вам нужно получить все td внутри tr без определения идентификатора для них, вы можете использовать следующий код:

var items = new Array();

$('#TABLE_ID td:nth-child(1)').each(function () {
      items.push($(this).html());
});

Приведенный выше код добавит все первые ячейки внутри таблицы в переменную Array.

вы можете изменить nth-child (1), что означает, что первая ячейка относится к любому номеру ячейки, в которой вы нуждаетесь.

надеюсь, что этот код поможет вам.

Ответ 7

Получить первое значение td при щелчке последнего td в таблице

$(this).parent().siblings(":first").text()